首页 > 代码库 > 缓冲运动框架
缓冲运动框架
/** * Created by Lenovo on 2016/9/11. */ function show(ele){ ele.style.display = "block"; } /** * 获取元素样式兼容写法 * @param ele * @param attr * @returns {*} */ function getStyle(ele,attr){ if(window.getComputedStyle){ return window.getComputedStyle(ele,null)[attr]; } return ele.currentStyle[attr]; } //参数变为3个 function animate(ele,json,fn){ //先清定时器 clearInterval(ele.timer); ele.timer = setInterval(function () { //开闭原则 var bool = true; //遍历属性和值,分别单独处理json //attr == k(键) target == json[k](值) for(var k in json){ //四部 var leader = parseInt(getStyle(ele,k)) || 0; //1.获取步长 var step = (json[k] - leader)/10; //2.二次加工步长 step = step>0?Math.ceil(step):Math.floor(step); leader = leader + step; //3.赋值 ele.style[k] = leader + "px"; //4.清除定时器 //判断: 目标值和当前值的差大于步长,就不能跳出循环 //不考虑小数的情况:目标位置和当前位置不相等,就不能清除清除定时器。 if(json[k] !== leader){ bool = false; } } console.log(1); //只有所有的属性都到了指定位置,bool值才不会变成false; if(bool){ clearInterval(ele.timer); //所有程序执行完毕了,现在可以执行回调函数了 //只有传递了回调函数,才能执行 if(fn){ fn(); } } },1); } //获取屏幕可视区域的宽高 function client(){ if(window.innerHeight !== undefined){ return { "width": window.innerWidth, "height": window.innerHeight } }else if(document.compatMode === "CSS1Compat"){ return { "width": document.documentElement.clientWidth, "height": document.documentElement.clientHeight } }else{ return { "width": document.body.clientWidth, "height": document.body.clientHeight } } }
缓冲运动框架
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。