<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. Callable接口、Runable接口、Future接口

    1. Callable与Runable区别 Java从发布的第一个版本开始就可以很方便地编写多线程的应用程序,并在设计中引入异步处理.Thread类.Runnable接口和Java内存管理模型使得多线 ...

  2. Almost Sorted Array

    http://acm.hdu.edu.cn/contests/contest_showproblem.php?cid=646&pid=1006 #include<iostream> ...

  3. lr_save_string 和 sprintf 的使用

    lr_save_string 和 sprintf 的使用 一.lr_save_string 使用介绍1.该函数主要是将程序中的常量或变量保存为lr中的参数.格式: //将常量保存为参数 lr_save ...

  4. Liferay 6.2 改造系列之一:源码编译和服务启动

    一.导入源码 源码可以从Liferay的官方网站上下载.http://www.liferay.com/downloads/liferay-portal/available-releases 下载后解压 ...

  5. 用Python做自然语言处理必知的八个工具【转载】

    Python以其清晰简洁的语法.易用和可扩展性以及丰富庞大的库深受广大开发者喜爱.其内置的非常强大的机器学习代码库和数学库,使Python理所当然成为自然语言处理的开发利器. 那么使用Python进行 ...

  6. Java类与对象的基础学习

    1. 请输入并运行以下代码,得到什么结果? public class Test{ public static void main(String args[]){ Foo obj1=new Foo(); ...

  7. 利用StringList对象来管理这些动态生成的对象

    如果程序需要动态创建大量的对象,那么我们可以利用StringList对象来管理这些动态生成的对象.1.创建StringList对象:OBJ := TStringList.Create; 2.保存动态生 ...

  8. NOIP201103瑞士轮【B002】

    [B002]瑞士轮[B级]出自附中OJ————————————————————————————————————————————————————————————————————————————————— ...

  9. Python学习笔记04

    语句之后有冒号,表示有一个语句块,且以四个空格的缩进来表示隶属关系. 与C# 相比,没有了{},没有了(),被冒号和缩进取代了 if,while,for,range,continue,break if ...

  10. ural 1249. Ancient Necropolis

    1249. Ancient Necropolis Time limit: 5.0 secondMemory limit: 4 MB Aerophotography data provide a bit ...