jquery队列函数用法实例


Posted in Javascript onDecember 16, 2014

本文实例讲述了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>

  div { margin:3px; width:40px; height:40px;

        position:absolute; left:0px; top:30px; 

        background:green; display:none; }

  div.newcolor { background:blue; }

  </style>

  Click here...

  <div></div>

<script>

$(document.body).click(function () {

      $("div").show("slow");

      //$("div").slideDown();

      $("div").animate({left:'+=200'},2000);

      $("div").queue(function () {//入队列

          $(this).addClass("newcolor");

          $(this).dequeue();//出队列

      });

      $("div").animate({left:'-=200'},2000);

      $("div").queue(function () {//入队列

          $(this).removeClass("newcolor");

          $(this).dequeue();//出队列

      });

      $("div").slideUp();

});

</script>

</body>

</html>

希望本文所述对大家jQuery程序设计的学习有所帮助。

Javascript 相关文章推荐
javascript复制对象使用说明
Jun 28 Javascript
js中将HTMLCollection/NodeList/伪数组转换成数组的代码
Jul 31 Javascript
JS判断日期格式是否合法的简单实例
Jul 11 Javascript
微信小程序 网络请求(GET请求)详解
Nov 16 Javascript
JS中检测数据类型的几种方式及优缺点小结
Dec 12 Javascript
jQuery Easyui 下拉树组件combotree
Dec 16 Javascript
jquery uploadify隐藏上传进度的实现方法
Feb 06 Javascript
Angular实现的table表格排序功能完整示例
Dec 22 Javascript
Angular Renderer (渲染器)的具体使用
May 03 Javascript
小程序视频列表中视频的播放与停止的示例代码
Jul 20 Javascript
vue数据响应式原理知识点总结
Feb 16 Javascript
JS addEventListener()和attachEvent()方法实现注册事件
Jan 11 Javascript
JQuery仿小米手机抢购页面倒计时效果
Dec 16 #Javascript
jQuery实现数字加减效果汇总
Dec 16 #Javascript
javascript使用switch case实现动态改变超级链接文字及地址
Dec 16 #Javascript
浅谈Javascript变量作用域问题
Dec 16 #Javascript
IE6/IE7中JavaScript json提示缺少标识符、字符串或数字问题处理
Dec 16 #Javascript
javascript arguments使用示例
Dec 16 #Javascript
javascript实现日期格式转换
Dec 16 #Javascript
You might like
PHP原生函数一定好吗?
2014/12/08 PHP
php防止sql注入简单分析
2015/03/18 PHP
PHP/ThinkPHP实现批量打包下载文件的方法示例
2017/07/31 PHP
解决PHPstudy Apache无法启动的问题【亲测有效】
2020/10/30 PHP
CSS+Jquery实现页面圆角框方法大全
2009/12/24 Javascript
指定位置如果有图片显示图片,无图片显示广告的JS
2010/06/05 Javascript
js解决select下拉选不中问题
2014/10/14 Javascript
NodeJS学习笔记之FS文件模块
2015/01/13 NodeJs
浅谈javascript中this在事件中的应用
2015/02/15 Javascript
js实现背景图片感应鼠标变化的方法
2015/02/28 Javascript
JS基于clipBoard.js插件实现剪切、复制、粘贴
2016/05/03 Javascript
JavaScript队列、优先队列与循环队列
2016/11/14 Javascript
jQuery插件DataTable使用方法详解(.Net平台)
2016/12/22 Javascript
AngularJS实现的base64编码与解码功能示例
2018/05/17 Javascript
深入浅出理解JavaScript闭包的功能与用法
2018/08/01 Javascript
在vue中使用setInterval的方法示例
2019/04/16 Javascript
深入解析koa之异步回调处理
2019/06/17 Javascript
js实现页面导航层级指示效果
2020/08/25 Javascript
vue 项目软键盘回车触发搜索事件
2020/09/09 Javascript
python使用pipeline批量读写redis的方法
2019/02/18 Python
Python自定义函数计算给定日期是该年第几天的方法示例
2019/05/30 Python
Python模块、包(Package)概念与用法分析
2019/05/31 Python
python 实现将文件或文件夹用相对路径打包为 tar.gz 文件的方法
2019/06/10 Python
将tensorflow.Variable中的某些元素取出组成一个新的矩阵示例
2020/01/04 Python
浅谈tensorflow 中的图片读取和裁剪方式
2020/06/30 Python
Python子进程subpocess原理及用法解析
2020/07/16 Python
Python用Jira库来操作Jira
2020/12/28 Python
python 实现百度网盘非会员上传超过500个文件的方法
2021/01/07 Python
戴森西班牙官网:Dyson西班牙
2020/02/04 全球购物
医学类导师推荐信范文
2013/11/19 职场文书
幼儿园教师教学反思
2014/02/06 职场文书
2015年护士工作总结范文
2015/03/31 职场文书
大学生实习介绍信
2015/05/05 职场文书
修辞手法有哪些?
2019/08/29 职场文书
浅谈Golang 嵌套 interface 的赋值问题
2021/04/29 Golang
Windows server 2022创建创建林、域树、子域的步骤
2022/06/25 Servers