原生js的animate方法

66 阅读 0 评论 44 点赞

我是靠谱客的博主天真蚂蚁，最近开发中收集的这篇文章主要介绍原生js的animate方法，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

之前学习的时候，看到animate方法就想到了jQuery,习惯了,以为animate就是属于jQuery。今天发现不是，至少不是jQuery的专属品，请看代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <div id="animate-test">animate-test</div>
    <script>
       document.getElementById("animate-test").animate([
            { transform: 'translateX(0px)' }, 
            { transform: 'translateX(300px)' }
        ], { 
            duration: 3000,
            iterations: Infinity
        });
    </script>
</body>
</html>

向大家推荐一个网站,笔者很多东西都是在这上面学的

MDN-推荐网站