Универсальный jQuery-скрипт для блоков с вкладками (табами)
Вступление Мое знакомство с фреймворком jQuery произошло в 2008-м году, после того, как, однажды, на одном из англоязычных сайтов я нашел jQuery-скрипт, который позволяет создавать блоки с удобными вкладками. Этому скрипту я посвятил отдельный пост на данном блоге. С тех пор прошло 2 года, ...
Комментарии (978)
спасибо Дим, буду пробовать
за скрипт спасибо, как раз для одного сайта пригодится.
оффтоп: не знаешь как разбить теги на категории? чтобы моңно было выводить и т.д. как у слона под статьями, напр. http://slon.ru/articles/309304/
Я, так понимаю, тебе это для ВП нужно. Не знаю. Самому интересно, как такое сделать.
нашел
http://www.sonika.ru/blog/wordpress/wordpress-taxonomies-28.htm
у меня все получилось
http://etatar.ru/8/37385
Спасибо, возьмем на заметку.
Спасибо за скрипт, Дима. Ох как бы он мне пригодился полгода назад.
А о старом варианте не знал? Он же 2 года, как на блоге выложен.
Не знал. Я тогда какое-то другое решение нашел.
Больше похоже на решение конкретной проблемы, чем на универсальный скрипт. Для универсальности не хватает настроек.
Код можно значительно сократить, примерно так:
Скрипт хорош, а можете подсказать как сделать так, чтобы он запоминал открытую вкладку, и при переходе (или обновлении) на другую страницу, показывал открытой ту вкладку, которая была активна.
Примерно догадываюсь, что это как то надо сохранить в куках, но опыта маловато пока в этом.
+1, тоже интересно очень.
Как у меня появится настрой, сделаю пример.
Все таки очень нужно при обновлении страницы оставлять на активной вкладке, хотя бы чуток толкните в сторону решения (опыта совсем нет :((()
Нужно подключать скрипт для кук, который используется здесь.
Сделал пример.
Спасибо :) за 3 дня плотного использования JQuery, узнал ОЧЕНЬ много нового и началось это с твоих табов :)))
Пожалуйста =)
Нет эффекта при появлении, но и нет глюка с перескакиванием в начало страницы. А нужный эффект, если не ошибаюсь, можно прописывать в свойствах show().
Ну и, конечно же, спасибо!
Да, действительно. Проблема, значит, в
animate()
.Хороший блог, полезные статьи. Спасибо, Дмитрий. Подписался на RSS!
Добрый день.
Я бы на вашем месте не объявлял .current в табах и .visible в боксах — мне кажется, это лишняя манипуляция. Класс .visible можно принудительно обозначить для соответствующего элемента при обработке скрипта.
Они используются для того, чтобы при отключенном JavaScript все отображалось как следует.
Побольше бы таких колес и мир стал бы в разы лучше :-) Так что давай, изобретай еще велосипед, электричество и всё остальное – мы будем только рады твоим таким изобретениям :-)
О чем это я.. А да, спасибо тебе, Дим, – ты как всегда великолепен!
Полностью переписал сайдбар благодаря твоим вкладкам :-)
Спасибо =)))
Все здорово, а не подскажет ли кто как сделать вложенные табы :) Что-то я итак и сяк и никак…
Что за вложенные табы?
вложенные значит внутри одного бокса еще несколько табов
Вот здесь я ответил на этот вопрос.
решил вопрос дублированием кода скрипта… и элементов на форме. более красивого нет решения?
Хорошее минималистическое решение, уже пристроил к делу в блоге, где табы уже используются. Смущает одно, а есть ли смысл только для табов подключать библиотеку под 50-70 кило? Может быть найдется решение изменить код к примеру у “tabbera” – у него на все про все 8 кило.
Только ради табов не стоит. В таком случае лучше действительно найти решение на чистом JavaScript.
Dimox, спасибо за скрипт! jQuery очень удобен в этом плане)
Великолепная работа.
Есть вопрос –
Как сделать, чтобы поисковили индексировали
содержимое?
А кто сказал, что они его не индексируют?
Хороший компактный скрипт, только конфликтует с datepicker почему-то… что первым поставишь, то и будет работать. Очень жаль ((
В сокращенном скрипте анимация присутствует?
Да.
Теперь нужно попробывать сделать на своем блоге такое. Выглидит на самом деле лучше.
Спасибо за плагин. Подскажи как исправить следующую ситуацию: если добавить табы внутрь другого таба, то всё перестаёт работать. Бага. Как избавиться? Хелп.
Сам спросил, сам отвечаю.
Для большей универсальности нужно заменить строку:
var p = $(this).parents(‘div.section’);
на:
var p = $(this).parent(‘div.section’);
И тогда начинают работать табы внутри табов. Хо-хо-хо.
Эммм… поспешил, всё равно не работает((