css动画 js写法
CSS动画和JavaScript动画都是创建动画的方式，但它们有不同的使用场景和优缺点。在JavaScript中创建CSS动画，我们通常是通过操作CSS属性或者改变类来完成的。
以下是一个简单的例子，我们使用JavaScript来改变一个元素的类，从而实现动画效果：
<!DOCTYPE html>
<html>
<head>
    <style>
        .animate {
            animation: myAnimation 2s infinite;
        }
        @keyframes myAnimation {
            0%  {background-color: red;}
            50%  {background-color: yellow;}
            100% {background-color: blue;}
        }
    </style>
</head>
<body>
html动画效果<h1 id="myElement">Hello World!</h1>
<button onclick="myFunction()">Click Me!</button>
<script>
    function myFunction() {
        ElementById("myElement").classList.add("animate");
    }
</script>
</body>
</html>
在这个例子中，当你点击按钮时，会触发myFunction函数，这个函数会到id为"myElement"的元素，并给它添加一个名为"animate"的类。这个类定义了一个名为"myAnimation"的关键帧动画，这个动画会在2秒内改变元素的背景颜。
这是一个非常基础的例子，实际上你可以通过JavaScript来更复杂地控制CSS动画，例如通过计算来改变元素的属性，或者在动画结束后执行某些操作等等。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。