weixin_45811367
艾尔德瑞安
采纳率50%
2020-12-23 18:27 阅读 0

js的dom元素运动速度无法超过1?

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div style="width: 200px; height: 200px; position: absolute; background-color: black;"></div>
</body>
<script>
    let div = document.getElementsByTagName('div')[0]
    function animation(){
        requestAnimationFrame(animation)
        div.style.left = div.offsetLeft + 1 + 'px'    // 这里的1是速度,改为小于1的值时,运动停止
    }
    animation()
</script>
</html>

这是一个简单的动画,但是当我将速度‘1’设为小于1的值后,哪怕是0.9,他都会停止运动,请教大佬们 这个该如何解决

  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 复制链接分享

3条回答 默认 最新

  • weixin_45811367 艾尔德瑞安 2020-12-24 10:14

    题目有误,运动速度无法小于1,一旦小于1,--------------------div.style.left = div.offsetLeft + 0.9 + 'px'-------------此代码就无法执行,尝试用事件函数测试过,并不是定时器的原因

    点赞 评论 复制链接分享
  • csdn_chengpeng 程鹏; 2020-12-24 10:18

    px是像素值,像素是没有小数的,最小精确到个位数 1

    点赞 评论 复制链接分享
  • weixin_45811367 艾尔德瑞安 2020-12-25 16:36

    问题已经找到了,div.offsetLeft这个值是自动取整的,所以函数每次进入的时候都是不变的,已经解决

    点赞 评论 复制链接分享

相关推荐