$(“.mytest”).queue(function(){$(this).text(“动画完成”)});
})
$(“#count”).click(function(){
alert($(“.mytest”).queue().length)
})
})
</script>
</head>
<body>
<div class=”box”>
<div class=”mytest”></div>
</div>
<button id=”do”>点击开始动画</button>
<button id=”count”>计算队列中函数数量</button>
</body>
</html>
以上代码实现了我们最终需要效果。
实例二:
<!DOCTYPE html>
<html>
<head>
<meta charset=” utf-8″>
<meta name=”author” content=”//www.jb51.net/” />
<title>queue()函数-软件开发网</title>
<style type=”text/css”>
.box{
width:300px;
height:150px;
}
.mytest{
width:50px;
height:50px;
background-color:green;
position:absolute;
left:0px;
display:none;
font-size:12px;
}
</style>
<script type=”text/javascript” src=”mytest/jQuery/jquery-1.8.3.js”></script>
<script type=”text/javascript”>
$(document).ready(function(){
$(“#do”).click(function(){
$(“.mytest”).show(1000);
$(“.mytest”).animate({left:”+=200″},3000);
$(“.mytest”).animate({top:”+=50″},2000);
$(“.mytest”).queue(function(){
$(this).text(“动画还将持续”);
});
$(“.mytest”).animate({left:”-=200″},3000);
})
$(“#count”).click(function(){
alert($(“.mytest”).queue().length)
})
})
</script>
</head>
<body>
<div class=”box”>
<div class=”mytest”></div>
</div>
<button id=”do”>点击开始动画</button>
<button id=”count”>计算队列中函数数量</button>
</body>
</html>
以上代码中,我们想在执行完text()方法之后再执行一个自定义动画,但是表现却并非如此,最后面的自定义动画并没有执行。
代码修改如下:
<!DOCTYPE html>
<html>
<head>
<meta charset=” utf-8″>
<meta name=”author” content=”//www.jb51.net/” />










