-
为什么同样的代码chrome可以完美运行但是在IE里甚至都不能运行起来，什么变化都没有查看全部
-
使用json来完成轻量级数据交换，即多个运动同时发生。json的一般形式为obj={name:value},不同的name值中间用逗号隔开，里面是一对一对的值，固定循环形式为for（in），例如 for (var i in obj){ alert(i);/弹出对象是name的值 alert（obj[i]);/弹出对象是value的值 }查看全部
-
var timer=null; var alpha=30; function startMove(obj,attr,iTarget,fn){ clearInterval(timer); timer=setInterval(function(){ var icur=0; if(attr=='opacity'){ icur=Math.round(parseFloat(getStyle(obj,attr))*100); } else{ icur=parseInt(getStyle(obj,attr)); } var speed=(iTarget-icur)/10; speed=speed>0?Math.ceil(speed):Math.floor(speed); if(icur==iTarget){ clearInterval(obj.timer); if(fn){ fn(); } } else{ if(attr=='opacity'){ obj.style.filter='alpha(opacity:'+(icur+speed)+')'; obj.style.opacity=(icur+speed)/100; } else{ obj.style[attr]=icur+speed+"px";} } },30); } function getStyle(obj,attr){ if(obj.currentStyle){ return obj.currentStyle; } else{ return getComputedStyle(obj,false)[attr]; } } </script> </head>查看全部
-
<style> #div1{ width:200px; height:100px; background:yellow; border:1px solid #000; filter:alpha(opacity:30); opacity:0.3; } </style> <script> window.onload=function(){ var oDiv=document.getElementById('div1'); oDiv.onmouseover=function(){ startMove(oDiv,"width",400,function(){ startMove(oDiv,"height",200,function(){ startMove(oDiv,"opacity",100) }); }); } oDiv.onmouseout=function(){ startMove(oDiv,"opacity",30,function(){ startMove(oDiv,"height",100,function(){ startMove(oDiv,"width",200) }); }); } }查看全部
-
链式动画其实就是在原来的基础上多传一个参数，作为回调函数，确认一个变化执行完以后就执行该函数。嵌套函数。查看全部
-
getstyle封装属性时注意区别opacity,可以把传入属性是透明度的情况挑出来，单独进行改写，区别有正常height,width整型转换用parseInt,但是透明度要用parseFloat,最后取值是应该加上math.round()让结果四舍五入在正确范围内。赋值转换要注意兼容问题，IE是filter,其他浏览器是opacity查看全部
-
window.onload=function(){ var aLi=document.getElementsByTagName("li"); for(var i=0;i<aLi.length;i++){ aLi[i].timer=null; aLi[0].onmouseover=function(){ startMove(this,"height",400); } aLi[0].onmouseout=function(){ startMove(this,"height",100); } } aLi[1].onmouseover=function(){ startMove(this,"width",400); } aLi[1].onmouseout=function(){ startMove(this,"width",200); } } //var timer=null; function startMove(obj,attr,iTarget){ clearInterval(obj.timer); obj.timer=setInterval(function(){ var icur=parseInt(getStyle(obj,attr)); var speed=(iTarget-icur)/10; speed=speed>0?Math.ceil(speed):Math.floor(speed); if(icur==iTarget){ clearInterval(obj.timer); } else{ obj.style[attr]=icur+speed+"px"; } },30); }查看全部
-
如果页面不仅仅有宽和高，而是有好多别的样式，比如边界，为了避免出现误差，可以用getStyle来封装一个函数获取相应的值，注意浏览器兼容问题，IE用currentStyle，火狐用getComputedStyle。 function getStyle(obj,attr){ if(obj.currentStyle){ return obj.currentStyle; } else{ return getComputedStyle(obj,false)[attr]; } }查看全部
-
json:轻量级数据交换格式查看全部
-
只要是多物体运动，所有的东西都不能公用，无论是定时器还是变量，为了避免资源共用冲突，给每一个物体设置该属性的遍历。查看全部
-
speed=speed>0?Math.ceil(speed):Math.floor(speed) 这个写法就相当于 if(speed>0) { speed = math.ceil(speed); } else { speed = math.floor(speed); }查看全部
-
currentStyle 针对IE浏览器 getComputedStyle 针对firefox（火狐，浏览器） get style的两种获取方式查看全部
-
Opacity属性用来设置一个元素的透明度，取值范围是0~1之间，不可为负值。opacity取值为1是完全不透明，取值为0是完全透明，视觉上看不见。关于浏览器对opacity属性的兼容性请继续往下看：查看全部
-
currentStyle 针对IE浏览器 getComputedStyle 针对firefox（火狐，浏览器） get style的两种获取方式查看全部
-
转hm5007：其实问题很简单 不知楼下众位说得辣么复杂干嘛子 也就是老师写的flag变量相对于定时器的回调函数是全局变量，而回调函数会把全局变量flag赋值成false，辣么纵观整个作用域没有一个是把flag赋值成true的，也就是不可能会执行到清除timer和执行链式的最后一个参数fn，所以，得把flag设为true放在定时器回调里成为局部变量，把检测停止函数放在for in外接着后面，而回调里会把flag设为false，每次回调执行完就会把flag销毁，这样flag就不会一直是false从而进不了清除timer和执行fn的函数查看全部
举报
0/150
提交
取消