2015年12月_午夜玫瑰钻

12月

原创 Javascript面向对象及组件详细介绍（五）原型链

原型链原型链原型链原型链原型链> html> head> meta http-equiv="Content-Type" content="text/html; charset=utf-8"> title>无标题文档title> script> //原型链 : 实例对象与原型之间的连接，叫做原型链 //原型链的最外层 : Ob

2015-12-30 20:20:00 462

原创 Javascript面向对象及组件详细介绍（四）包装对象

包装对象包装对象包装对象包装对象包装对象> html> head> meta http-equiv="Content-Type" content="text/html; charset=utf-8"> title>无标题文档title> script> /*function Aaa(){ this.name = '小明';

2015-12-30 20:18:33 246

原创 Javascript面向对象及组件的详细介绍（三）面向对象的拖拽

面向对象的拖拽> html> head> meta http-equiv="Content-Type" content="text/html; charset=utf-8"> title>无标题文档title> style> #div1 div,#div2 div{ width:200px; height:200px; border:1px #0

2015-12-30 20:15:44 261

原创 Javascript面向对象及组件开发（二）面向对象的写法

面向对象的写法> html xmlns="http://www.w3.org/1999/xhtml"> head> meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> title>无标题文档title> script> function 构造函数(){

2015-12-30 20:12:06 451

原创 Javascript面向对象及组件开发的详细介绍（一）

> html xmlns="http://www.w3.org/1999/xhtml"> head> meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> title>无标题文档title> script> var arr = []; arr.number

2015-12-30 20:06:34 587

原创 JS 替换 window.onload 的 document.ready

通常我们想要在页面内容加载完成后运行 JS 时，都会使用 window.onload 来处理，比如：1 window.onload = function(){2 alert('Hello World!');3 };这段代码将在页面载入完成后弹出一个 "Hello World!" 的警告框，但是众所周知，window.onload 的特点是页

2015-12-30 11:27:55 650

原创 window.onload详解信息

一进入首页立刻会弹出一个窗口，或者按一个连接或按钮弹出，通常在这个窗口里会显示一些注意事项、版权信息、警告、欢迎光顾之类的话或者作者想要特别提示的信息。其实制作这样的页面效果非常的容易，只要往该页面的HTML里加入几段Javascript代码即可实现。【1、最基本的弹出窗口代码】　　　　　　　　window.open ('page.html')

2015-12-30 11:09:54 571

原创 JavaScript拖动层Div代码

无标题文档*{ margin:0; padding:0;} .div{ width:100px; height:100px; position:absolute;left:100px; top:100px; background:#ccc;} var div = document.getElementsByTagName('di

2015-12-29 09:57:28 352

原创 JavaScript实现原理简述

在AS3中，使用startDrag()就能实现拖拽，但是js中，却没有此方法，但是也是可以实现的，说穿了，挺简单的。实现拖拽方法不少，我呢，js功力尚浅，只知道一种实现原理。如下：①鼠标按下+鼠标移动 → 拖拽②鼠标松开 → 无拖拽③鼠标偏移 → 拖拽距离用JavaScript事件方法表示就是：① onmousedown + onmousemove → startDrag(

2015-12-29 08:48:27 637

原创完整版move.js移动框架

function getByClass(oParent,cName){var elements = document.getElementsByTagName('*');var i = 0;var results = [];for(var i=0;iif(elements[i].className == cName){results.push(elements[i]);

2015-12-28 21:09:16 1083

原创用js实现同一页面多个不同运动效果2

要点一：function getstyle(obj,name){if(obj.currentStyle){return obj.currentStyle[name];}else{return getComputedStyle(obj,false)[name];}}从样式表中根据id和属性名取值。要点二：if(attr == "opacity"){cur

2015-12-21 20:51:52 474

原创用js实现同一页面多个不同运动效果

要点一//查询某个对象的某个属性值function getStyle(obj,attr){if(obj.currentStyle){return obj.currentStyle[attr];}else{return getComputedStyle(obj,false)[attr];}}要点二//在此操作想要获取对象的属性var divs

2015-12-21 20:42:51 522

原创滚动广告效果

body,div,span{margin:0;padding: 0}#div1{width: 100px;height: 100px;background: red;position: absolute;right: 3px;} var div = document.getElementById('div1');//先让div居中显示

2015-12-21 12:53:58 409

原创 Javascript图片轮播效果

注意：图片的路径和图片的名字要改成1.jpg/2.jpg/3.jpg等格式，根据数组下标进行查询，亲测有效body,div,ul,li,img{margin: 0px;padding: 0px;}#menu{width: 496px;margin: auto;}#head{border: 1px solid blue;}#he

2015-12-21 10:49:36 417

原创 Javascript仿京东放大镜的效果

随便找一个图片吧。小伙伴们，想怎么玩就怎么玩（注意路径），亲自测试，绝对没问题。body,div{margin: 0; padding: 0;}#zhuti{ margin:50px;position: relative;}#small{width: 300px;height: 187px;border: 1px solid #000;

2015-12-21 10:47:12 496

原创 Javascript图片轮播效果一秒换一个

/*增加一秒换一个的功能/运用定时器的用法。body,div,ul,li,img{margin: 0px;padding: 0px;}#menu{width: 496px;margin: auto;}#head{border: 1px solid blue;}#head img{width: 100%;height: 30

2015-12-21 10:34:34 1012