JavaScript编程开发中jquery队列函数用法实例教程
本文实例讲述了jquery队列函数用法。分享给大家供大家参考。具体实现方法如下:
代码如下:
<!doctype>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="jquery-1.9.1.js"></script>
</head>
<body>
<style>
p { margin:3px; width:40px; height:40px;
position:absolute; left:0px; top:30px;
background:green; display:none; }
p.newcolor { background:blue; }
</style>
click here...
<p></p>
<script>
$(document.body).click(function () {
$("p").show("slow");
//$("p").slidedown();
$("p").animate({left:'+=200'},2000);
$("p").queue(function () {//入队列
$(this).addclass("newcolor");
$(this).dequeue();//出队列
});
$("p").animate({left:'-=200'},2000);
$("p").queue(function () {//入队列
$(this).removeclass("newcolor");
$(this).dequeue();//出队列
});
$("p").slideup();
});
</script>
</body>
</html>
推荐阅读
-
JavaScript编程开发中jQuery插件开发详细教程
-
JavaScript编程开发中jQuery的缓存机制浅析
-
JavaScript编程开发中基于jQuery的视频播放插件开发教程
-
JavaScript编程开发中jquery获取radio值实例教程
-
JavaScript编程开发中如何使用jquery实现放大镜效果
-
jQuery中closest()函数用法实例教程
-
JavaScript编程开发中jquery搜索框效果实现方法
-
JavaScript编程开发中jquery常用操作小结
-
JavaScript编程开发中jquery中post方法用法实例教程
-
JavaScript编程开发中jquery.cookie.js使用指南