<div class="divtt">
<div class="divtest"></div>
</div>
<div class="divtt">
<div class="divtest"></div>
</div>
<div class="divtt">
<div class="divtest"></div>
</div>
<div class="divtt">
<div class="divtest"></div>
</div>

.divtt
{
position: relative;
width: 150px;
height: 150px;
border: 1px solid black;
float: left;
margin-left: 10px;
margin-top: 10px;
overflow: hidden;
}

.divtest
{
position: absolute;
width: 150px;
height: 150px;
opacity: 0.3;
top: 0px;
left: -150px;
background-color: black;
}

<div class="divtt">
<div class="divtest"></div>
</div>
<div class="divtt">
<div class="divtest"></div>
</div>

<div class="divtt">
<div class="divtest"></div>
</div>

<div class="divtt">
<div class="divtest"></div>
</div>

<div class="divtt">
<div class="divtest"></div>
</div>
<div class="divtt">
<div class="divtest"></div>
</div>

var div1 = $(".divtt").find(".divtest")
var FUNC = [
function () {  div1.eq(0).animate({ left: "150px" }, 200, aniCB); },
function () {  div1.eq(1).animate({ left: "150px" }, 200, aniCB); },
function () {  div1.eq(2).animate({ left: "150px" }, 200, aniCB); },
function () {  div1.eq(3).animate({ left: "150px" }, 200, aniCB); },
function () {  div1.eq(4).animate({ left: "150px" }, 200, aniCB); },
function () { div1.eq(5).animate({ left: "150px" }, 200, aniCB); },
function () { div1.eq(6).animate({ left: "150px" }, 200, aniCB); },
function () {  div1.eq(7).animate({ left: "150px" }, 200, aniCB); },
function () {  div1.eq(8).animate({ left: "150px" }, 200, aniCB); },
function () { div1.eq(9).animate({ left: "150px" }, 200, aniCB); },
function () { div1.eq(9).animate({ left: "-150px" }, 200, aniCB); },
function () { div1.eq(8).animate({ left: "-150px" }, 200, aniCB); },
function () { div1.eq(7).animate({ left: "-150px" }, 200, aniCB); },
function () { div1.eq(6).animate({ left: "-150px" }, 200, aniCB); },
function () { div1.eq(5).animate({ left: "-150px" }, 200, aniCB); },
function () { div1.eq(4).animate({ left: "-150px" }, 200, aniCB); },
function () { div1.eq(3).animate({ left: "-150px" }, 200, aniCB); },
function () { div1.eq(2).animate({ left: "-150px" }, 200, aniCB); },
function () { div1.eq(1).animate({ left: "-150px" }, 200, aniCB); },
function () { div1.eq(0).animate({ left: "-150px" }, 200, aniCB); },
];
var aniCB = function () {
$(document).dequeue("myAnimation");
}
$(document).queue("myAnimation", FUNC);
aniCB()

JQ 队列的更多相关文章

  1. jQuery源代码解析(3)—— ready载入、queue队列

    ready.queue放在一块写,没有特殊的意思,仅仅是相对来说它俩可能源代码是最简单的了.ready是在dom载入完毕后.以最高速度触发,非常实用. queue是队列.比方动画的顺序触发就是通过默认 ...

  2. jquery技巧之让任何组件都支持类似DOM的事件管理

    本文介绍一个jquery的小技巧,能让任意组件对象都能支持类似DOM的事件管理,也就是说除了派发事件,添加或删除事件监听器,还能支持事件冒泡,阻止事件默认行为等等.在jquery的帮助下,使用这个方法 ...

  3. 【原创经验分享】WCF之消息队列

    最近都在鼓捣这个WCF,因为看到说WCF比WebService功能要强大许多,另外也看了一些公司的招聘信息,貌似一些中.高级的程序员招聘,都有提及到WCF这一块,所以,自己也关心关心一下,虽然目前工作 ...

  4. js与jq对数组的操作

    一.数组处理 1.数组的创建  var arrayObj = new Array(); //创建一个数组  var arrayObj = new Array([size]); //创建一个数组并指定长 ...

  5. Oracle 中的作业队列和队列调度

    一,启动执行作业的进程       在 Oracle 中,是使用 “作业队列协调进程(CJQ0)” 这个协调数据库实例的作业队列的后台进程,来监视作业队列中的作业表(JOB$),并启动作业队列进程(J ...

  6. NodeJS系列~第三个小例子,NodeJs与Redis实现高并发的队列存储

    返回目录 众所周知 redis量个强大的缓存组件,可以部署在win32和linux环境之上,它有五大存储结构,其中有一种为列表list,它可以实现quene和stack的功能,即队列和堆栈的功能. r ...

  7. 今天讲的是JQ 的动画效果

    老规矩,先贴代码 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> < ...

  8. JQ库函数记忆要点

    1.核心(1.核心函数2.对象访问3.数据缓存4.队列控制4.插件机制5.多库共存) 2.属性(1.属性2.css类3.HTML代码/文本/值) 3.选择器(表单,表单对象属性,基本,内容,子元素,层 ...

  9. 【原】iOS多线程之异步任务+并行队列情况与异步任务+串行队列(主队列)情况

    异步任务+并行队列 把异步任务放到并行队列进行执行,异步任务会在不同的线程中执行. /*异步执行+并行队列*/ - (IBAction)clickBasic1:(UIButton *)sender { ...

随机推荐

  1. 【转】CDH5.x升级

    http://www.cloudera.com/content/www/zh-CN/documentation/enterprise/5-3-x/topics/cm_ag_upgrade_cm5.ht ...

  2. loadrunner取出字符串的后面几位

    Action() {    char *phonenum;    int k=1;    phonenum=lr_eval_string("{phoneNum}");//参数化获取 ...

  3. js小例子(多字溢出,省略号表示)

    实现了div中字数较多,显示不下的时候,用省略号来表示,并且可以展开和收起: <html> <head> <meta http-equiv="Content-T ...

  4. 【转】Python yield 使用浅析

    转载地址: www.ibm.com/developerworks/cn/opensource/os-cn-python-yield/ Python yield 使用浅析 初学 Python 的开发者经 ...

  5. uva-1339Ancient Cipher

    Ancient Roman empire had a strong government system with various departments, including a secret ser ...

  6. hihoCoder#1384 : Genius ACM

    对于一个固定的区间$[l,r]$,显然只要将里面的数字从小到大排序后将最小的$m$个和最大的$m$个配对即可. 如果固定左端点,那么随着右端点的右移,$SPD$值单调不降,所以尽量把右端点往右移,贪心 ...

  7. 期待中冷静前行,专家预测2017年VR产业5大发展趋势

    VR在90年代火过一阵后,在2016年迎来了爆发.今年的VR领域,除了Oculus.HTC.索尼等发布的各家硬件,还有许多VR内容争奇斗艳的迸发,但是VR会一直保存热度吗? 事实上,对于科技圈巨头而言 ...

  8. ACM : Travel-并查集-最小生成树 + 离线-解题报告

    Travel Time Limit:1000MS     Memory Limit:131072KB     64bit IO Format:%I64d & %I64u /*题意 给出n[节点 ...

  9. Ubuntu Gnome 14.04.2 lts 折腾笔记

    unity感觉不爽,于是来折腾gnome3 = = 首先去官网下载ubuntu gnome 14.04.2 lts的包(种子:http://cdimage.ubuntu.com/ubuntu-gnom ...

  10. 【BZOJ3224】Tyvj 1728 普通平衡树 Splay

    Description 您需要写一种数据结构(可参考题目标题),来维护一些数,其中需要提供以下操作:1. 插入x数2. 删除x数(若有多个相同的数,因只删除一个)3. 查询x数的排名(若有多个相同的数 ...