以下是一个使用 jQuery 实现动画效果的简单示例。这个示例会让一个元素在页面加载时向右移动，并在点击时回到原始位置：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>jQuery 动画示例</title> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <style> #animatedBox { width: 100px; height: 100px; background-color: red; position: relative; } </style> </head> <body> <div id="animatedBox"></div> <script> $(document).ready(function() { // 页面加载时的动画 $("#animatedBox").animate({ left: '250px' }, "slow"); // 点击时的动画 $("#animatedBox").click(function() { $(this).animate({ left: '0' }, "slow"); }); }); </script> </body> </html>
在这个示例中，#animatedBox 是一个红色的正方形块，初始位置是在页面的左侧。当页面加载时，使用 animate() 方法将其向右移动 250 像素。当用户点击该块时，它将以相同的速度返回到初始位置。
ヾ(~▽~)Bye~Bye~
