js缓冲运动

最新推荐文章于 2024-10-07 09:24:46 发布

你你你就你

最新推荐文章于 2024-10-07 09:24:46 发布

阅读量105

点赞数

文章标签： javascript

本文链接：https://blog.csdn.net/Ga_b_c/article/details/107452854

版权

 <style>
    * {
      padding: 0;
      margin: 0;
    }

    #box {
      width: 100px;
      height: 100px;
      background: skyblue;
      position: fixed;
      left: 0;
      top: 0;
    }
  </style>

<body>
  <div id="box"></div>
</body>
<script>

  var direction = 1000;


  var timer = setInterval(function () {
    var left = box.offsetLeft;
    var speed = (direction - left) / 30;
 

    // speed = speed > 1 ? speed : 1

    speed = Math.abs(speed) < 1 ? speed / Math.abs(speed) : speed

    console.log(speed);

    left += speed;

    if (left >= direction) {
      clearInterval(timer);
      left = direction;
    }

    box.style.left = left + 'px';

  }, 100)

</script>