На сайте работает система табов на jQuery. При клике на таб само-собой меняется класс на активный (подчёркнутый, выделенный, назывывайте как хотите)
Нужно добавить поддержку cookies, а если конкретнее, то при клике на определённый таб в кукисах должен сохранится активный таб и после перезагрузки страницы оставаться активным.
Вот сам плагин:
(function($) {
$.fn.smoothTabs = function(fadeSpeed) {
// Clicked tab class
var $smoothTabsLiCurrent = 'smoothTabsLiCurrent';
// Hidden div class
var $smoothTabsDivHidden = 'smoothTabsDivHidden';
// Visible div class
var $smoothTabsDivVisible = 'smoothTabsDivVisible';
// Makes first tab current, hides all divs and fades in the first one
this.each(function() {
$("ul li:first", this).addClass($smoothTabsLiCurrent);
$(this).find("div").addClass($smoothTabsDivHidden);
$('div:first', this).fadeIn(fadeSpeed)
.addClass($smoothTabsDivVisible)
.removeClass($smoothTabsDivHidden);
});
// Tab click function
$('ul li', this).hover(function(){
var $parentUl = $(this).parent();
var $parentDiv = $($parentUl).parent();
$('li', $parentUl).removeClass($smoothTabsLiCurrent);
$(this).addClass($smoothTabsLiCurrent);
var $clickedIndex = $('li', $parentUl).index(this);
var $currentDiv = $('div', $parentDiv).get($clickedIndex);
// If current tab is clicked - we're done
if ($($currentDiv).attr('class') == $smoothTabsDivVisible) {
return false;
}
// Current div is replaced by the selected one
$('.'+$smoothTabsDivVisible, $parentDiv).fadeOut(fadeSpeed, function(){
$($currentDiv).fadeIn(fadeSpeed).addClass($smoothTabsDivVisible).removeClass($smoothTabsDivHidden);
});
$('.'+$smoothTabsDivVisible, $parentDiv).removeClass($smoothTabsDivVisible).addClass($smoothTabsDivHidden);
});
};
})(jQuery);
Код для вывода:
$(document).ready(function(){
$('.smoothTabs').smoothTabs('fast');
});
<div class="smoothTabs">
<ul>
<li>tab 1</li>
<li>tab 2</li>
</ul>
<div>
content for tab 1
</div>
<div>
content for tab 2
</div>
</div>
Кто поможет?
