Вступление Мое знакомство с фреймворком jQuery произошло в 2008-м году, после того, как, однажды, на одном из англоязычных сайтов я нашел jQuery-скрипт, который позволяет создавать блоки с удобными вкладками. Этому скрипту я посвятил отдельный пост на данном блоге. С тех пор прошло 2 года, ...
Внимание! Нижеизложенная статья на данный момент не актуальна. Вместо нее читайте статью «Универсальный jQuery-скрипт для блоков с вкладками (табами)«. * * * Примерно последние месяц-два на англоязычных блогах мне стали ...
Предлагаю вашему вниманию скрипт, который плавно прокручивает страницу наверх при клике на соответствующую ссылку. Я сделал 2 варианта: на чистом JavaScript и на jQuery. Выбирайте тот, который вам больше по ...
На своем другом блоге я недавно объяснил, почему в данный момент кнопка «Google +1» не может быть добавлена в моем сервисе Share42.com, о чем все просят. Однако прямо сейчас на ...
Внимательные пользователи моего сайта Share42.com заметили, что на нем с определенной поры появились красивые всплывающие подсказки, и меня попросили рассказать, как такое сделать. Поэтому я хочу поделиться с вами моим ...
Комментарии (978)
Хотел прикрутить аналогичный скрипт, но на всех страницах кроме главной отображался тупо текст вместо вкладок, а с этим все заработало как надо, спасибо. Так что изобретать такие колеса надо, раз предыдущие колеса квадратные =)
Спасибо, улыбнуло =)
Вобщем, вот исправленный вариант, где можно вставлять табы внутри табов:
Закомментированы строки, которые были ранее.
Я уписал табы в две строки кода.
$('li.t').click(function(){$( '.content > div').hide() ;$( '#' + $( this ).attr( 'rel' ) ).toggle();});
Кому интересно, — пример реализации здесь
У тебя приходится нумеровать блоки и соответствующие им табы, я же в своем скрипте этого избежал.
Да, так… Но при генерации html средствами скажем php, в нуменации нет проблем.
Я пытался избавить скрипт от поиска нужного элемента. Именно на это тратится основной код и время.
Отличная штука. Давно хотел что то подобно на блоге сделать, стоит задуматься. Правда надо дизайнера попанать…
Очень понравилось как вы сделали Reated Posts + Recent Post в конце статьи…
Вот блин…затупил что то я :( А как же быть если у меня в сайдбаре виджеты отображаются, а не кодом через sidebar.php выводится содержимое? :(
Такие табы с виджетами WordPress не совместимы. Придется выбирать одно из двух.
Вот подстава :( Видимо придется этим заморочиться лишь когда буду новый дизайн заказывать. А пока так буду.
У вас все красиво организовано, мне так нравится.
Очень интересный скрипт, а как вы сделали так, что при выделении текста курсором бек становится оранжевым?
https://dimox.name/overriding-the-default-text-selection-color-with-css/
Спасибо за статью,но вот столкнулся с такой проблемой что внутри вкладки при переключение на новую не срабатывают скрипты что находятся внутри вкладки,можно ли как нибудь это исправить?
К сожалению, даже не представляю, в чем может быть причина.
Большое спасибо. Мне пригодится этот пост. Скрипт очень нужный и полезный.
Спасибо.Полезно. Возьму на заметку!
И на сайты свои, наверное, добавлю — вещь интересная.
Ооо.. спасибо, попробовал на своем блоге ;)
А ещё подскажите как с помощью куков сделать запоминание последней открытой вкладки
Вот тут.
Дмитрий,огромное спасибо за статью=)
Подскажите плз, а как в ваши табы вставить функции вывод последних записей, комментов и рубрики новостей, например?
Не понял, в чем трудность. Скопировать код функций и вставить в код блоков с табами.
Спасибо за скрипт, очень понравился. Использую вариант с cookie, для запоминания открытого таба. Вот только вопрос возник, можно ли сделать так, чтобы для отдельно взятой страницы прописывались свои cookie? А то сейчас получается, открыл я например второй таб на первой странице, перешёл на допустим на третью, а там уже открыт второй таб, а хотелось бы, чтобы для каждой страницы было индивидуально.
Вот этого я не знаю.
Если выбор открытого таба для определённой страницы неизменен, то легче всего присваивать class=»current» нужному табу при генерации страницы.
Если предстоит запоминать выбор, то придется раскладывать дополнительные куки.
Меня, как раз, второе интересует. В jQuery я фактически 0, поэтому, не могли бы вы поподробней рассказать, как лучше реализовать всё это дело?
P.S. Предложили ещё такой вариант — поставить куке path аналогичный адресу страницы. Чтобы браузер не посылал это же куку при запросе других страниц.
В плагине находим строчку:
в которой есть
Вместо
пишем
Тогда куки будут запоминаться для конкретной страницы.
Кстати, можно вообще не указывать
тогда по умолчанию куки присваиваются той странице на которой прописываются куки.
Yamanga, о jQuery все можешь спросить здесь http://www.linkexchanger.su/forum/
Пости вопрос, поможем.
За статью спасибо! Очень пригодилось. Только жаль, что переключение не плавное — просто моргает. Как сделать, чтобы табы плавно переключались, как в этом примере: http://bitby.net/wp-demo/web/tabs1.html ?
В скрипте поменяй цифру 150 на побольше, например, 500.
Спасибо, помогло :)
Подскажите, кто силён в jQuery, как прикрутить анимацию (плавное появление) к табам с куками чтобы не перекидывало в начало страницы?
Попробовал взять за основу код этого блога, но чтото запутался в скрипте, мало я ещё соображаю в jQuery.
Классная штука! Спасибо.
В своё время я тоже использовал самописный простенький скрипт (здесь он в действии) + к ниму такой же простенький аналог ajax’а.
Скрипт просто сказка. Только не работаю вложенные вертикальные вкладки с вложенными горизонтальными вкладками :-(( помогите исправить