Таби на 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