Таби на jquery
30.05.2011

Завдання зробити таби на jquery.
<script type="text/javascript">
$(function () {
$("div.tabcontent ul.tabNavigation li:last").css("border-right", "0").css("width", "87px");
var tabContainers = $('div.tabcontent div.tabs-cont div'); // Замінюємо змінною всі div що у .tabs-cont.
tabContainers.hide().filter(':first').show(); // При завантаженні, ці div'и ховаємо, крім першого.
$('div.tabcontent ul.tabNavigation a').click(function() { // Дія відбувається при натисканні на посилання.
tabContainers.hide(); // Усі div'и ховаємо.
tabContainers.filter(this.hash).fadeIn("slow"); // Плавно виявляємо блок з id'ом вказаному в href посилання.
$('div.tabcontent ul.tabNavigation a').removeClass('selected'); // Видаляємо у всіх посилань клас selected.
$(this).addClass('selected'); // Додаємо клас selected на посилання, на яке клікнули.
return false;
}).filter(':first').click(); // При завантаженні, автоматично присвоюємо першому засланні клас selected.
});
Алгоритм роботи: Секціям (li) у блоці «.tabNavigation» присвоюється клас при натисканні, який змінюватиме колір фону. Вміст ".tabs-cont" плавно змінюватиме свою прозорість від hide до 1.0. Jquery знаходиться в коді і не є нав'язливим javascript кодом.
ПІДПИСАТИСЯ НА РОЗСИЛКУ НОВИН
Останнє в нашому блозі
Інтернет маркетинг
04.11.2019
Інтернет маркетинг
03.10.2019