var tabs = {
hide: {
'visibility': 'hidden',
'opacity': 0,
'height': 0
},
show: {
'visibility': 'visible',
'opacity': 1,
'height': 'auto'
},
class: {
panels: 'b-tab-panels',
nav: 'b-tab-nav',
item: 'item',
selected: 'selected'
}
};
var itemClass = tabs.class.nav + '__' + tabs.class.item;
var selectedClass = itemClass + '_' + tabs.class.selected;
var panelsItemClass = tabs.class.panels + '__' + tabs.class.item;
// Первой вкладке добавляетсякласс select
$('.'+itemClass+':first').addClass(selectedClass);
// Скрываются все блоки с описанием вкладок кроме первого
$('.'+panelsItemClass).css(tabs.hide).filter(':first').css(tabs.show);
// При клике на вкладку
$('.'+tabs.class.nav+' a').click(function(){
// - показывается блок с описанием текущей вкладки
$('.'+panelsItemClass).css(tabs.hide).filter(this.hash).css(tabs.show);
// - удаляется класс 'select' у активной ранее вкладки
$('.'+itemClass).removeClass(selectedClass);
// - добавляется класс 'select' для выбранной вкладки
$(this).parent().addClass(selectedClass);
// - прерывается обработка события onClick
event.preventDefault();
});