首页 > 编程笔记 > JavaScript笔记 > jQuery动画
jQuery delay()方法的用法
在 jQuery 中,我们可以使用 delay() 方法来延迟动画的执行。
语法:
举例:
预览效果如图 1 所示。

图 1:预览效果
在这个例子中,我们定义了两个动画。在第 1 段动画之后使用 delay() 方法来延迟 2 秒(即 2000 毫秒),然后执行第 2 段动画。
语法:
$().delay(speed)
speed 是一个必选参数,表示动画的速度,单位为毫秒。举例:
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="utf-8" />
- <title></title>
- <style type="text/css">
- div
- {
- width:50px;
- height:50px;
- background-color:lightskyblue;
- margin-top: 6px;
- }
- </style>
- <script src="js/jquery-1.12.4.min.js"></script>
- <script>
- $(function () {
- $("div").click(function () {
- $(this).animate({ "width": "150px" }, 1000)
- .delay(2000)
- .animate({ "height": "150px" }, 1000);
- });
- })
- </script>
- </head>
- <body>
- <div></div>
- </body>
- </html>

图 1:预览效果
在这个例子中,我们定义了两个动画。在第 1 段动画之后使用 delay() 方法来延迟 2 秒(即 2000 毫秒),然后执行第 2 段动画。
所有教程
- C语言入门
- C语言编译器
- C语言项目案例
- 数据结构
- C++
- STL
- C++11
- socket
- GCC
- GDB
- Makefile
- OpenCV
- Qt教程
- Unity 3D
- UE4
- 游戏引擎
- Python
- Python并发编程
- TensorFlow
- Django
- NumPy
- Linux
- Shell
- Java教程
- 设计模式
- Java Swing
- Servlet
- JSP教程
- Struts2
- Maven
- Spring
- Spring MVC
- Spring Boot
- Spring Cloud
- Hibernate
- Mybatis
- MySQL教程
- MySQL函数
- NoSQL
- Redis
- MongoDB
- HBase
- Go语言
- C#
- MATLAB
- JavaScript
- Bootstrap
- HTML
- CSS教程
- PHP
- 汇编语言
- TCP/IP
- vi命令
- Android教程
- 区块链
- Docker
- 大数据
- 云计算