兼容性获取样式+缓慢停止的运动

来源:互联网 发布:js对象数组转json 编辑:程序博客网 时间:2024/05/22 02:08
<script>
var btn = document.getElementById("btn");
var box =document.getElementById("box");


btn.onclick=function(){
move(box,{
width:100,
height:600,
left:600
},function(){
move(box,{
top:30,
left:30
});
})
}
function move(obj,json,fn){
clearInterval(obj.timer);
obj.timer=setInterval(function(){
var flag=true;
for(var k in json){
var leader=parseInt(getStyle(obj,k));
var step=(json[k]-leader)/10;
step=step>0?Math.ceil(step):Math.floor(step);
leader=leader+step;
obj.style[k]=leader+"px";
if (leader!=json[k]) {
flag=false;
}
}
if (flag) {
clearInterval(obj.timer);
if (fn) {
fn();
}
}
},30)
}
function getStyle(obj,attr) {
        if(obj.currentStyle) {
            return  obj.currentStyle[attr];
        }
        else
        {
            return window.getComputedStyle(obj,null)[attr];
        }
    }
</script>
原创粉丝点击