zoukankan      html  css  js  c++  java
  • JS之链式运动,及任意值运动框架,包括透明度的改变

      链式运动,顾名思义,一环扣一环,即执行完一个事件后,再接着执行下一个事件,在参数上面动手脚,将下一个要执行的函数名作为一个参数,即利用到回掉函数,下面代码中出现的fn,即回掉函数,

     1 function move(obj,attr,target,fn){
     2     clearInterval(obj.timer);
     3     obj.timer = setInterval(function(){
         //1,取当前值
    4 var iCur=0; 5 if (attr == 'opacity') { 6 iCur=parseInt(parseFloat(getStyle(obj,attr))*100); 7 }else{ 8 iCur = parseInt(getStyle(obj,attr)); 9 }
         //2,算速度
    10 var speed = (target-iCur)/8 11 speed = speed>0?Math.ceil(speed):Math.floor(speed);
         //3,计时停止
    12 if (iCur == target) { 13 clearInterval(obj.timer); 14 fn&&fn();//注意位置,要放在这里 15 } 16 else { 17 if (attr =='opacity') { 18 obj.style.opacity=(iCur+speed)/100; 19 }else{ 20 obj.style[attr]=iCur+speed+'px'; 21 } 22 } 23 24 },30); 25 }

      对于以上框架,还有可以利用json对其进行优化,以上框架是每次改变一个属性,利用json则可以同时改变多个属性,详情见  下篇博文,JS之完美框架

  • 相关阅读:
    python可视化---axvspan()函数
    python可视化---axhline()函数
    Git 操作
    miui10 傻瓜式安装google框架方法
    python 制作一对一聊天
    Pyqt5+python+ErIC6+QT designer
    session 详细解析(转)
    #Week7 Neural Networks : Learning
    Multilayer Perceptron
    Advice for applying ML & ML System Design
  • 原文地址:https://www.cnblogs.com/RitaLee/p/5601623.html
Copyright © 2011-2022 走看看