JS匀速/缓动i动画函数封装简易

缓动系数公式：缓动公式：起始值+=（结束值-起始值）*缓动系数

匀速

function LinearAnimation(btnid,boxid,step,target) {
            var btn=document.getElementById(btnid);
            var box=document.getElementById(boxid);
            var timer = null,begin = 0;
            btn.onclick = function () {
                clearInterval(timer);
                //2、设置定时器
                timer = setInterval(function () {
                    begin+=step;
                    if (begin>=target)
                    {
                        begin=target;
                        clearInterval(timer);
                    }
                    box.style.marginLeft = begin +"px";
                },100);
            }
        }

缓动

function HuanDAnimation(btnid,boxid,target,begin) {
            var btn=document.getElementById(btnid);
            var box=document.getElementById(boxid);
            //1、根据公式定义变量
            var timer = null;
            btn.onclick = function () {
                //2、开始动画
                clearInterval(timer);
                timer = setInterval(function () {
                    begin+=(target-begin)*0.2;
                    if (Math.round(begin)>=target)
                    {
                        begin=target;
                        clearInterval(timer);
                    }
                    box.style.marginLeft = begin+"px";
                },100);
            }
        }