美文网首页
简易运动函数

简易运动函数

作者: diviner_杨 | 来源:发表于2019-04-19 15:08 被阅读0次

简易运动函数

function StarMove(obj,attr,iTarget) {

    clearInterval(obj.timer);

    obj.timer = setInterval(function() {

        var iCur =parseInt(getStyle(obj, attr));

        var iSpeed = (iTarget - iCur)/6;

        iSpeed = iSpeed > 0? Math.ceil(iSpeed) : Math.floor(iSpeed);

        if(iCur == iTarget) {

              clearInterval(obj.timer);

        }else {

              obj.style[attr] = iCur + iSpeed +'px';

        }

    },30)

}
function getStyle(obj, attr) {

    if(obj.currentStyle) {

        return obj.currentStyle[attr];

    }else {

        return getComputedStyle(obj, false)[attr];

    }

}

多物体运动

for(var i = 0; i < oDiv.length; i++) {

      oDiv[i].timer = null;

      oDiv[i].onmouseover = function(){

            StarMove(this, 'width',300);

      }

      oDiv[i].onmouseout = function(){

             StarMove(this,'width', 100);

      }

}

相关文章

  • 简易运动函数

    简易运动函数 多物体运动

  • 运动函数

    function move(obj,target,cb){ clearInterval(obj.t) obj.t ...

  • 自制简易throttle函数

    throttle.js test.html 这样连点就不会重复触发函数了

  • Mysql窗口函数

    参考: MySQL 8.0窗口函数:用非常规思维简易实现SQL需求 数分面试-SQL篇 一、mysql窗口函数简介...

  • JS.封装好的运动函数

    运动函数animate animate函数是动画封装函数参数:elem参数是运动的对象targetJSON参数是运...

  • 抽奖模型

    利用 index和randbetween函数可制作简易的抽奖模型 index进行索引,randbetween产生随...

  • vue中的computed计算属性

    计算属性普通函数赋值或简易成员函数 赋值 都可以,不要使用箭头函数 特点 计算属性关联的data如果发生变化,会重...

  • jQuery不过如此

    简易的JQuery 1.1单纯的获取所有兄弟元素 1.2为一个元素添加类2.1 封装函数 2.2 封装函数 3.命...

  • 浅谈微积分

    变易,不易,简易。 。。。。。。。。。。。。。。。。 函数是变的(变易)。那么在变化中什么是不变的呢?极限。 ...

  • JavaScript封装简易动画函数

    1、简单的右移函数:鼠标点击按钮,box向右移动一定的位置 实现效果: 2、封装同时解决左右移动的动画函数 上面的...

网友评论

      本文标题:简易运动函数

      本文链接:https://www.haomeiwen.com/subject/xanqgqtx.html