运动

v = ( c / d ) * t + b

c:总路程

d :总时间

t:已过时间

b:初始位置

位置 = (总路程 / 总时间)* 已过时间 + 初始位置

调用 Tween.js

function move(param){

    var el = param.el;
    var attr = param.attr;
    var target = param.target;
    var d = param.d;
    var ease = param.ease || "linear";
    var callback = param.callback;

    var b = parseFloat(getComputedStyle(el)[attr]);//初始值
    var c = target - b;//总路程
    var past = new Date();//获取执行函数的时候的时间
    
    var valW=setInterval(function(){
        var currentTime = new Date();
        var t = currentTime - past;
        if(t >= d){
          t = d;
          clearInterval(valW);
        }
        // var v = ( c / d ) * t - b;
        var v = Tween[ease](t, b, c, d);
        el.style[attr] = v + "px";
        if(t == d){
          //完整版 左边为真返回右边,左边为undefined返回左边
          (typeof callback === "function")&&callback();

          // (typeof callback === "function")callback&&callback(); 缩写  
          //callback&&callback();
        }
      },16)

}

move({
        el:box,
        attr:"width",
        target:500,
        d:1000,
        callback:function(){console.lgo(123)}
    })

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值