在 jQuery 中,我们可以使用 delay() 方法来延迟动画的执行。
语法:
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 段动画。