GumbyFramework/Gumby — pull request #205 by Madii (2014-03-02 11:18:36+00:00)
Title: Adding fade option to gumby.tabs.js

Adding fade effect to tabs by adding class `fade` to the section `tabs`

````javascript
Tabs.prototype.click = function($this) {
// index of item to activate
var index = $this.parent().index();
var fade = this.$content.parent().hasClass('fade');
var activecontent = this.$content.eq(index);
var lastactivecontent = this.$content.parent().find('.tab-content.active');

if(this.$nav.eq(index).add(this.$content.eq(index)).hasClass('active')) {
return;
}

Gumby.debug('Setting active tab to '+index, this.$el);

// deactivate other tab navigation and content
this.$nav.removeClass('active');
// activate this tab nav link and content
this.$nav.eq(index).addClass('active');
//fade effect
if(fade == true){
$(lastactivecontent).fadeOut(200,'swing',function(){
$(this).removeClass('active').removeAttr('style');
});
$(lastactivecontent).promise().done(function(){
$(activecontent).fadeIn(200,"swing",function(){
$(this).addClass('active').removeAttr('style');
});
});
}
else {
this.$content.removeClass('active');
this.$content.eq(index).addClass('active');
}
// trigger gumby.change event and pass current active tab index
Gumby.debug('Triggering onChange event', this.$el);
this.$el.trigger('gumby.onChange', index);
};
````