原生JS实现弹性运动中需要注意的问题

艾光远

已于 2025-03-15 17:40:46 修改

阅读量247

点赞数 1

CC 4.0 BY-SA版权

分类专栏： JavaScript网页特效文章标签：前端开发 JavaScript

于 2019-08-17 10:13:14 首次发布

本文链接：https://blog.youkuaiyun.com/weixin_40629244/article/details/99689480

JavaScript网页特效专栏收录该内容

77 篇文章 ¥19.90 ¥99.00

订阅专栏

超级会员免费看

本文探讨了在实现原生JavaScript弹性运动时遇到的问题，特别是元素属性值过小可能导致的错误。建议在设计弹性运动效果时设置适当的限制，以避免反弹过程中的负值错误。通过提供的代码Demo，读者可以进一步理解并应用到自己的项目中。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在使用弹性运动时，需要注意一些小问题，即运动的元素所要改变的属性值不能太小，如果太小在反弹时就会出现负值，导致出现错误，所以要给出一定的限制，下面写一个小Demo，欢迎大家复制粘贴及吐槽。

先来看一下效果图：

以下是代码实现：

<!DOCTYPE html>
<html>

    <head>

        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>原生JS实现弹性运动中需要注意的问题</title>

        <style>
            #box {
                width: 100px;
                height: 30px;
                background: red;
            }
        </style>

    </head>

    <body>

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

        <script>

            window.on

了解本专栏