python前端基础--jquery动画03

白杨树~

于 2018-08-27 20:41:04 发布

阅读量172

点赞数 1

CC 4.0 BY-SA版权

分类专栏： html

本文链接：https://blog.youkuaiyun.com/qq_42336700/article/details/82118808

html 专栏收录该内容

16 篇文章

订阅专栏

此博客展示了一段HTML代码，通过引入jQuery库实现元素动画效果。当点击按钮时，页面上的黄色方块会缓慢向右移动100px，接着快速将字体大小增大到3em，体现了jQuery在前端交互中的应用。

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

<!DOCTYPE html>
<html>
   <head>
       <meta charset="utf-8" />
       <title></title>
       <script type="text/javascript" src="js/jquery-3.3.1.min.js"></script>
       <script>
           $(function(){
               $('button').click(function(){
                   var div = $('div');
                   div.animate({left:'100px'},"slow");
                   div.animate({fontSize:'3em'},"fast");
               })
           })
       </script>
   </head>
   <body>
       <button type="button">开始动画</button>
       <div style="background: yellow;width: 200px;height: 200px;position: absolute;">
           hello world
       </div>
   </body>
</html>