zoukankan      html  css  js  c++  java
  • JQ 队列

    <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;
    150px;
    height: 150px;
    border: 1px solid black;
    float: left;
    margin-left: 10px;
    margin-top: 10px;
    overflow: hidden;
    }

    .divtest
    {
    position: absolute;
    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()

  • 相关阅读:
    扩展运算符(Spread operator)
    增强的对象字面量,解构赋值
    ES6 模板字符串(template string)
    let和const
    svg实现放大效果
    svg制作风车旋转
    jquery实现某宝放大点击切换
    jQuery之文档处理
    jQuery之属性操作
    jQuery css操作
  • 原文地址:https://www.cnblogs.com/-maomao/p/4450631.html
Copyright © 2011-2022 走看看