-
获取样式的方法查看全部
-
运动框架实现思路查看全部
-
精简代码：当两段代码基本一致时，可以把不同的数值当作参数传入查看全部
-
offsetLeft:当前的left的值查看全部
-
@模仿淘宝转一圈效果 _this.style.top=30+'px';//这样的思想很赞！ 【温馨提示：Java、Jsp、Android、JS等编程爱好者可以联系Q：28554482，互相学习，共同进步！】 [ 查看全文 ] 10:50看截图 看视频 2016-06-18采集0 0 CMinC JS动画案例 <script src="js/move.js"></script> <script> window.onload=function(){ var oMain=document.getElementById('main'); oLis=oMain.getElementsByTagName('a'); for(var i=0;i<oLis.length;i++){ oLis[i].onmouseover=function(){ var _this=this.getElementsByTagName('i')[0];//这里得使用this,在鼠标运动中只能使用this，内函数无法识别oLis[i] startMove(_this,{top:-25,opacity:0},function(){ _this.style.top=30+'px'; startMove(_this,{top:20,opacity:100}); }); } } } </script> <body> <div id="main"> <a href="#"><i><img src="..."/></i><p>...</p></a> ...... <a href="#"><i><img src="..."/></i><p>...</p></a> </div> </body> ps：把onmouseover改成onmouseenter或者阻止事件onmouseover的冒泡查看全部
-
6查看全部
-
5查看全部
-
4查看全部
-
3查看全部
-
2查看全部
-
1查看全部
-
完美的运动框架 function getStyle (obj,attr) { if (obj.currentStyle) { return obj.currentStyle[attr]; } else{ return getComputedStyle(obj,false)[attr]; } } function startMove (obj,json,fn) { clearInterval(obj.timer); obj.timer=setInterval(function(){ for (var attr in json) {var flag=true;//假设 //1.取当前值 var icur=0; if (attr=='opacity') { icur=Math.round(parseFloat(getStyle(obj,attr))*100); } else{ icur=parseInt(getStyle(obj,attr)); } //2.算速度 var speed=(json[attr]-icur)/8; speed = speed>0?Math.ceil(speed):Math.floor(speed); //3.检测停止 if (icur!=json[attr]) { flag=false; } if (attr=='opacity') { obj.style.filter='alpha(opacity:'+icur+speed+')'; obj.style.opacity=(icur+speed)/100; } else{ obj.style[attr]=icur+speed+'px'; } } if(flag){ clearInterval(obj.timer); if(fn){ fn(); } } },30) }查看全部
-
获取样式查看全部
-
多物体运动～参数不能共用查看全部
-
所谓的链式运动，就是在平常的动画运动函数最后在传入一个参数，当第一个动画运动运动完后，检测一下有没有继续传入的参数，如果有的话就继续运行这个参数，这样重复下去就可以完成一套链式运动查看全部
举报
0/150
提交
取消