一个页面，多个flash（刚学jq插件）

只贴js那部分哦

 

调用

// flash轮播图
    var sumF=$('.btnTabs span').length/4; //有四个flash
    var flashT01=new flash($('.flash01'),sumF);
    var flashT02=new flash($('.flash02'),sumF);
    var flashT03=new flash($('.flash03'),sumF);
    var flashT04=new flash($('.flash04'),sumF);
    flashT01.createF();
    flashT02.createF();
    flashT03.createF();
    flashT04.createF();

 

 

详细代码

/**
 * 
 * @authors Jerry wong (you@example.org)
 * @date    2015-04-16 09:23:42
 * @version $Id$
 */

function flash(ele,num){
    this.num=num;
    this.element=ele;
    this.timer=null;
    this.oIndex=0;
    
}

flash.prototype={
    createF:function(){
        var _this=this;
        _this.autoP();
        $(_this.element).find('.btnNext').click(function(){
            _this.nextBtn();
            _this.autoP();
        });
        $(_this.element).find('.btnPrev').click(function(){
            _this.prevBtn();
            _this.autoP();
        });
        $(_this.element).find('.btnTabs span').click(function(){
            _this.numClick(this);
            _this.autoP();
        });
    },
    nextBtn:function(){
        this.oIndex++;
        if (this.oIndex>=this.num) {
            this.oIndex=0;
        };
        $(this.element).find('.adImg').eq(this.oIndex).fadeIn().siblings('.adImg').fadeOut();
        $(this.element).find('.btnTabs').children('span').eq(this.oIndex).addClass('selected').siblings().removeClass('selected');
    },
    prevBtn:function(){
        this.oIndex--;
        if (this.oIndex<0) {
            this.oIndex=this.num-1;
        };
        $(this.element).find('.adImg').eq(this.oIndex).fadeIn().siblings('.adImg').fadeOut();
        $(this.element).find('.btnTabs').children('span').eq(this.oIndex).addClass('selected').siblings().removeClass('selected');
    },
    numClick:function(ev){
        this.oIndex=$(ev).index();
        $(ev).addClass('selected').siblings().removeClass('selected');
        $(ev).parents().siblings('ul').children('.adImg').hide().eq(this.oIndex).fadeIn();
    },
    autoP:function(){
        var _this=this;
        clearInterval(_this.timer);
        _this.timer=setInterval(function(){
            _this.oIndex++;
            if (_this.oIndex>_this.num-1) {
                _this.oIndex=0;
            };
            $(_this.element).find('.adImg').eq(_this.oIndex).fadeIn().siblings('.adImg').fadeOut();
            $(_this.element).find('.btnTabs').children('span').eq(_this.oIndex).addClass('selected').siblings().removeClass('selected');
        }, 3000);
        
    }
}