zoukankan      html  css  js  c++  java
  • 淡入淡出效果实现。

      $(".slider-container:first-child", ".sliders").addClass("current").fadeIn(300);
                $(".next-button").click(function () {
                    var current = $(".slider-container.current", ".sliders").removeClass("current").fadeOut(300);
                    current.fadeOut(300, function () {
                        var next = current.next();
                        if (next.length == 0) {
                            $(".slider-container:first-child", ".sliders").addClass("current").fadeIn(300);
                        } else {
                            next.addClass("current").fadeIn(200);
                        }
                    });
                });

                $(".prev-button").click(function () {
                    var current = $(".slider-container.current", ".sliders").removeClass("current").fadeOut(300);
                    current.fadeOut(300, function () {
                        var prev = current.prev();
                        if (prev.length == 0)
                        { $(".slider-container:last-child", ".sliders").addClass("current").fadeIn(300); }
                        else {
                            prev.addClass("current").fadeIn(200);
                        }
                    })
                })

    <div class="slider-container">

    <div class="sliders">

    <div class="slider">

    aaaaaaa

    </div >

    <div class="slider">

    bbbbbb

    </div >

    <div class="slider">

    cccccc

    </div >

    </div>

    </div>

  • 相关阅读:
    设计模式(十)—— 装饰者模式
    设计模式(九)—— 组合模式
    设计模式(八)—— 桥接模式
    设计模式(七)—— 适配器模式
    LINQ to XML
    设计模式(六)—— 单例模式
    设计模式(五)—— 原型模式
    Asp.Net程序目录下文件夹或文件操作导致Session失效的解决方案
    基于.Net平台常用的组件和框架整理
    Javascript中最常用的55个经典技巧(转)
  • 原文地址:https://www.cnblogs.com/mina/p/2512204.html
Copyright © 2011-2022 走看看