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 相关文章推荐
jQuery 对Select的操作备忘记录
Jul 04 Javascript
javascript实现文本域写入字符时限定字数
Feb 12 Javascript
jQuery实现拖动调整表格单元格大小的代码实例
Jan 13 Javascript
jQuery实现下拉框多选 jquery-multiselect 的实例代码
Jul 14 Javascript
AngularJS基础 ng-list 指令详解及示例代码
Aug 02 Javascript
JS获取多维数组中相同键的值实现方法示例
Jan 06 Javascript
关于vue.js v-bind 的一些理解和思考
Jun 06 Javascript
js防刷新的倒计时代码 js倒计时代码
Sep 06 Javascript
JS实现非首屏图片延迟加载的示例
Jan 06 Javascript
Javascript Promise用法详解
May 10 Javascript
Vue $attrs &amp; inheritAttr实现button禁用效果案例
Dec 07 Vue.js
vue生命周期钩子函数以及触发时机
Apr 26 Vue.js
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
下载网站打开页面后间隔多少时间才显示下载链接地址的代码
2010/04/25 Javascript
jBox 2.3基于jquery的最新多功能对话框插件 常见使用问题解答
2011/11/10 Javascript
JS日期和时间选择控件升级版(自写)
2013/08/02 Javascript
javascript 实现 原路返回
2015/01/21 Javascript
js实现全国省份城市级联下拉菜单效果代码
2015/09/07 Javascript
快速学习JavaScript的6个思维技巧
2015/10/13 Javascript
Bootstrap每天必学之折叠(Collapse)插件
2016/04/25 Javascript
js 弹出虚拟键盘修改密码的简单实例
2016/10/10 Javascript
js关于getImageData跨域问题的解决方法
2016/10/14 Javascript
js仿淘宝商品放大预览功能
2017/03/15 Javascript
jQuery实现的响应鼠标移动方向插件用法示例【附源码下载】
2018/08/28 jQuery
微信小程序设置全局请求URL及封装wx.request请求操作示例
2019/04/02 Javascript
vant-ui组件调用Dialog弹窗异步关闭操作
2020/11/04 Javascript
[02:39]我与DAC之Newbee.Moogy:从论坛到TI
2018/03/26 DOTA
Python实现删除Android工程中的冗余字符串
2015/01/19 Python
python实现读取命令行参数的方法
2015/05/22 Python
Python抓取电影天堂电影信息的代码
2016/04/07 Python
利用Python自带PIL库扩展图片大小给图片加文字描述的方法示例
2017/08/08 Python
python实现人民币大写转换
2018/06/20 Python
pandas.DataFrame选取/排除特定行的方法
2018/07/03 Python
Pytorch Tensor的统计属性实例讲解
2019/12/30 Python
python随机模块random使用方法详解
2020/02/14 Python
Python 实现日志同时输出到屏幕和文件
2020/02/19 Python
python 5个顶级异步框架推荐
2020/09/09 Python
用python发送微信消息
2020/12/21 Python
Python爬虫定时计划任务的几种常见方法(推荐)
2021/01/15 Python
Python+Appium实现自动化清理微信僵尸好友的方法
2021/02/04 Python
黄色火烈鸟:De Gele Flamingo
2019/03/18 全球购物
企业门卫岗位职责
2013/12/12 职场文书
学雷锋志愿服务月活动总结
2014/03/09 职场文书
党建目标管理责任书
2014/07/25 职场文书
董事会决议范本
2015/07/01 职场文书
回门宴新娘答谢词
2015/09/29 职场文书
如何做好工作总结!
2019/04/10 职场文书
MySQL的InnoDB存储引擎的数据页结构详解
2022/03/03 MySQL
Win10玩csgo闪退如何解决?Win10玩csgo闪退的解决方法
2022/07/23 数码科技