Вступление Мое знакомство с фреймворком jQuery произошло в 2008-м году, после того, как, однажды, на одном из англоязычных сайтов я нашел jQuery-скрипт, который позволяет создавать блоки с удобными вкладками. Этому скрипту я посвятил отдельный пост на данном блоге. С тех пор прошло 2 года, ...
Внимание! Нижеизложенная статья на данный момент не актуальна. Вместо нее читайте статью “Универсальный jQuery-скрипт для блоков с вкладками (табами)“. * * * Примерно последние месяц-два на англоязычных блогах мне стали ...
Предлагаю вашему вниманию скрипт, который плавно прокручивает страницу наверх при клике на соответствующую ссылку. Я сделал 2 варианта: на чистом JavaScript и на jQuery. Выбирайте тот, который вам больше по ...
На своем другом блоге я недавно объяснил, почему в данный момент кнопка “Google +1” не может быть добавлена в моем сервисе Share42.com, о чем все просят. Однако прямо сейчас на ...
Внимательные пользователи моего сайта Share42.com заметили, что на нем с определенной поры появились красивые всплывающие подсказки, и меня попросили рассказать, как такое сделать. Поэтому я хочу поделиться с вами моим ...
Комментарии (978)
Вот дополнение только с эфaектом fadeOut -In
Ваш скрипт, даже обновленный, не выводит виджеты Google+ в FifeFox и в IE 11. Вы пробовали делать такие закладки для виджетов соц. сетей?
Здравствуйте! Скажите, а в примере номер 4 можно ли сделать, чтобы при нажатии на якорь, не просто таб активировался, но и чтобы страница прокручивалась вниз до этого таба? Помогите, пожалуйста!
Решение здесь.
Скажите, а если использовать этот скрипт, поисковики будут индексировать содержимое этих вкладок? Или текст, который написан с использованием этого скрипта, не будет индексироваться и учитываться поисковиками?
Будут нормально индексировать, вкладки это все лишь спрятанные блоки через display:none
Отличный блог! Всем спасибо за помощь! Очень оперативно и по делу. Скорость ответов – быстрая, как в чате:)
Ещё один вопрос) Скажите, а можно ли сделать так, чтобы после нажатия на якорь, #tab не приклеивалось в адресной строке к url’у? или хотя бы, чтобы при нажатии f5, то есть при обновлении страницы эта приписка удалялась из адресной строки. Просто, когда мы нажимаем на якорь всё ок работает, но если обновить страницу, то снова срабатывает якорь.
Из адреса нельзя убрать. А чтобы не срабатывало при перезагрузке страницы, удалите эту часть кода:
Большое спасибо, Вы очень помогли!
Приветствую.
Есть ли решение “якорь + запоминание по кукам или localStorage”?
Нужно что бы переносило на определенный таб, но и что бы при перезагрузке страницы пользователь оставался на нужной странице.
Только по отдельности.
Добрый вечер! А можно ли как-то сделать так, чтобы зайдя на страницу активной была, например, 3 вкладка. И это с учетом того, что абсолютно на всех страницах активной будет третья вкладка, где используется ваша структура табов? Другими словами, может ли администратор установить активной, например, 3 третью вкладку?
В HTML-коде переставьте классы
.activeна соответствующие блоки.Приветствую! Использую ваш скрипт на сайте. Левая колонка получилось очень большой и при нажатии не видно контента вверху страницы. Можно ли как-то дополнить скрипт, чтобы при нажатии на таб страничка скоролилась в самый верх?
Добрый день!
Подскажите, что делать, если внутри div вкладок используются еще вложенные div со своими классами. Проблема в том, что они остаются скрытыми.
Не подскажите, появились следующие вопросы:
1. какой код проверки прописать, если у пользователя не работает Javascript, чтобы вывести содержимое без табов.
2. Хотел бы сослаться якорной ссылкой из контента вне таба на этой же странице на содержимое внутри таба, но если вкладка не активная, то якорная ссылка не работает. Как можно заставить заработать ссылку?
Добрый день!
Спасибо за хороший скрипт. Возник вопрос.
У меня организованы вкладки на странице. Выше вкладок есть текст и ссылки с якорями.
Как можно организовать чтобы ссылки с якорями ссылались на вкладки, при этом при нажатии на ссылку посетителя переносило бы внутрь вкладки, то есть чтобы вкладка активировалась по нажатию на ссылку.
Не увидел сразу пример 4. :-)
А возможно и, чтобы при нажатии ссылки с якорем, помимо переключения вкладки еще бы осуществлялся бы физический перенос к этой вкладке?
У меня вкладки находятся ниже текста, и не попадают в видимую часть страницы.
Решение здесь.
Очень-очень нужно(
Приветствую! Использую ваш скрипт на сайте. Левая колонка получилось очень большой и при нажатии не видно контента вверху страницы. Можно ли как-то дополнить скрипт, чтобы при нажатии на таб страничка скоролилась в самый верх?
dimox, подскажи, как сделать автоматическую прокрутку данных табов?
Такое ощущение, что где-то видел именно такую реализацию твоих табов, но вспомнить не могу.
Не знаю, такую функцию делают в слайдерах.
Dimox, скажи пожалуйста, почему может перескакивать класс .active на divaх рандомным образом?
у меня стоит обработчик не click, а mouseover?
Без понятия, может быть, что-то в скрипте не правильно.
Народ, а на Андроиде то вкладки не переключаются. Как нибудь можно решить проблемсс???
У меня переключаются без проблем.
Приветствую! Хочу поблагодарить за скрипт! Очень выручил!
Есть сайт http://goodwincinema.ru/, там есть две вкладки – Сейчас в кино, скоро на экранах. Когда между ними переключаешься, меняется содержимое и содержимое карусели. С помощью данного скрипта подобное реализовать можно? Автор, буду Вам очень признателен за Ваше внимание!!!
Можно.
Dimox, спасибо Вам большое! Вы мне очень помогли!
Dimox, будьте добры пожалуйста, подскажите, а как реализовать такое: при клике на слайдер, меняется содержимое? это по той же ссылке, которую выше давал. Мне кажется этот плагин такое сможет сотворить!
Мой скрипт только вкладки переключает. Для слайдера нужен отдельный плагин.
Если Вам что-либо известно, дайте знать пожалуйста. Но в любом случае Вам спасибо!!!
Здравствуйте.
Скажите, как эти табы установить на Юкоз?
возможно данный блок с вкладками встроить в шаблон wordpress? проще говоря заменить основное меню?