首页
所有分类
TAGS
文字工具 EMOJI BIBLE
编程 Javascript

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程序设计的学习有所帮助。

jquery队列函数用法实例

- Author -

shichen2014

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐
javascript入门·动态的时钟,显示完整的一些方法,新年倒计时
Oct 01 Javascript
详解JavaScript中的every()方法
Jun 08 Javascript
jquery实现点击查看更多内容控制段落文字展开折叠效果
Aug 06 Javascript
解决angular的post请求后SpringMVC后台接收不到参数值问题的方法
Dec 10 Javascript
Node.js操作Firebird数据库教程
Mar 04 Javascript
Bootstrap与KnockoutJs相结合实现分页效果实例详解
May 03 Javascript
Node.js+Express配置入门教程详解
May 19 Javascript
JS冒泡事件与事件捕获实例详解
Nov 25 Javascript
Layui给数据表格动态添加一行并跳转到添加行所在页的方法
Aug 20 Javascript
微信小程序实现的picker多级联动功能示例
May 23 Javascript
vue-router路由模式详解(小结)
Aug 26 Javascript
vue中watch和computed的区别与使用方法
Aug 23 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
reduce(2) 短信验证码(1) Selenium(1) Django(9) TextInputLayout(1) dockerfile(1) SQLite3(1) 分布式锁(3) Tsmoothie(1) filter(1)
You might like
MySQL GBK→UTF-8编码转换
2007/05/24 PHP
PHP 日期加减的类，很不错
2009/10/10 PHP
PHP学习笔记之二 php入门知识
2011/01/12 PHP
基于PHP文件操作的详细诠释
2013/06/21 PHP
解析获取优酷视频真实下载地址的PHP源代码
2013/06/26 PHP
Destoon旺旺无法正常显示，点击提示“会员名不存在”的解决办法
2014/06/21 PHP
php实现与python进行socket通信的方法示例
2017/08/30 PHP
使用vs code编辑调试php配置的方法
2019/01/29 PHP
PhpStorm连接服务器并实现自动上传功能
2020/12/09 PHP
如何让您的中波更粗更长 - 中波框形天线制作
2021/03/10 无线电
Js数组的操作push,pop,shift,unshift等方法详细介绍
2012/12/28 Javascript
jQuery插件开发的五种形态小结
2015/03/04 Javascript
js限制文本框只能输入中文的方法
2015/08/11 Javascript
基于jquery实现ajax无刷新评论
2020/08/19 Javascript
js获取上传文件的绝对路径实现方法
2016/08/02 Javascript
BootStrap学习系列之布局组件(下拉,按钮组[toolbar],上拉)
2017/01/03 Javascript
angularjs性能优化的方法
2018/09/05 Javascript
浅谈Vue.js 关于页面加载完成后执行一个方法的问题
2019/04/01 Javascript
基于vue中的scoped坑点解说
2020/09/04 Javascript
vue 基于abstract 路由模式 实现页面内嵌的示例代码
2020/12/14 Vue.js
python 二分查找和快速排序实例详解
2017/10/13 Python
python3+PyQt5使用数据库窗口视图
2018/04/24 Python
Python实现的redis分布式锁功能示例
2018/05/29 Python
Python实例方法、类方法、静态方法的区别与作用详解
2019/03/25 Python
django 捕获异常和日志系统过程详解
2019/07/18 Python
ubuntu上安装python的实例方法
2019/09/30 Python
如何提高python 中for循环的效率
2020/04/15 Python
Python matplotlib模块及柱状图用法解析
2020/08/10 Python
python MD5加密的示例
2020/10/19 Python
体验完美剃须：The Art of Shaving
2018/08/06 全球购物
Ellesse英国官网：意大利高级运动品牌
2019/07/23 全球购物
中学门卫岗位职责
2013/12/26 职场文书
房屋买卖委托公证书
2014/04/08 职场文书
离婚协议书范本及离婚须知
2014/10/15 职场文书
质监局领导班子践行群众路线整改方案
2014/10/26 职场文书
小学推普周活动总结
2015/05/07 职场文书