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