tab.js

简单Tab,只为会员简单Tab,只为会员简单Tab,只为会员简单Tab,只为会员

/**
 * @author huaoguo
 */
var Tab = new Class({
    Implements: [Options, Events],
    options: {
        onActive: $empty
    },
    tabs: [],
    initialize: function(containers, tabs, options){
        this.setOptions(options);
        containers = $$(containers);
        $$(tabs).each(function(tab, index){
            this.addSection(tab, containers[index]);
        }, this);
        this.show(0);
    },
    addSection: function(tab, container){
        this.tabs.include(tab);
        tab.store('container', container);
        this.attach(tab);
    },
    attach: function(tab){
        tab.addEvent('click', function(event){
            event.preventDefault();
            this.show(this.tabs.indexOf(tab));
        }
.bind(this));
        tab.addEvents({
            mouseover: function(){
                this.addClass('hover');
            },
            mouseout: function(){
                this.removeClass('hover');
            }
        })
    },
    show: function(index){
        if (this.current === index) 
            return;
        this.tabs.each(function(tab, i){
            var container = tab.retrieve('container');
            if (index === i) {
                tab.addClass('active');
                container.setStyle('display', 'block');
                this.fireEvent('onActive', [index]);
            } else {
                tab.removeClass('active');
                container.setStyle('display', 'none');
            }
        }
.bind(this));
        this.current = index;
    }
})