-
【难】 json 的用法 同时运动动画效果查看全部
-
JS动画运动框架查看全部
-
获取样式查看全部
-
运动框架实现思路查看全部
-
JS中 obj.style.attr 只能获取行内样式 要获取非行内样式要通过obj.currentStyle[attr]或者getComputedStyle(obj,false)[attr]方法获取 可以封装为function getStyle(obj,attr){ if(obj.currentStyle){return obj.currentStyle[attr];}else{returngetComputedStyle(obj,false)[attr]}} obj.offsetWidth 返回值是数值所以不用parseInt（）；而obj.style.width获取的是像素值查看全部
-
多物体动画不能共用一个定时器。查看全部
-
function startMove(obj,json,fn){ clearInterval(obj.timer); obj.timer=setInterval(function(){ var flag=true; //标志所有运动是否到达目标值 for(var attr in json){ var curr=0; //获取当前的值，设置为0下面进行赋值 //判断是否为透明度 if(attr=='opacity'){ curr=Math.round(parseFloat(getStyle(obj,attr))*100); //对透明度处理 }else{ curr=parseInt(getStyle(obj,attr)); //对普通的宽高处理 } //移动速度处理 var speed=0; speed=(json[attr]-curr)/8; //json[attr]为属性值即目标值 speed=speed>0?Math.ceil(speed):Math.floor(speed); //取整数，将速度取整从而达到目标值 //检测停止 if(curr!= json[attr]){ flag=false;//检测为false则继续下面的操作 } if (attr=='opacity') { obj.style.filter='alpha(opacity:'+(curr+speed)+’)’;//IE浏览器 obj.style.opacity=(curr+speed)/100;//firefox浏览器 }else{ obj.style[attr]=curr+speed+'px'; } } if(flag){ //检测为true则继续下面的操作 clearInterval(obj.timer); if(fn){ //检测是否有回调函数，有就执行 fn(); } } },30); } //取样式 function getStyle(obj,attr){ if(obj.currentStyle){ return obj.currentStyle[attr]; //IE取样式 }else{ return getComputedStyle(obj,false)[attr]; } }查看全部
-
JS中obj.style.attr只能获取行内样式,要获取非行内样式要通obj.currentStyle[attr]或者getComputedStyle(obj,false)[attr]方法获取 可以封装为 function getStyle(obj,attr){ if(obj.currentStyle){ return obj.currentStyle[attr]; }else { return getComputedStyle(obj,false)[attr]; } } obj.offsetWidth 返回值是数值所以不用parseInt（）；而obj.style.width获取的是像素值查看全部
-
缓冲运动思路！查看全部
-
不能直接设置就用赋值。查看全部
-
虽然传递的参数越少越感觉高大上（但个人觉得若是第一次读这样的代码会需要更久的理解时间。查看全部
-
变成传递参数的了查看全部
-
一步一步该起来最后变成可以动的查看全部
-
JS动画基本模板查看全部
-
getStyle,获得属性查看全部
举报
0/150
提交
取消