Javascript скользящее меню

Question

Я пытаюсь найти что-то похожее на выпадающий список «Содержание» вверху, расположенный в http://codeigniter.com/user_guide/, но для jQuery.Похоже, что этот сайт использует библиотеку moo tools fx.Кто-нибудь знает уже существующий плагин для jQuery, который делает то же самое, или простой код javascript для достижения того же эффекта скольжения для этого меню?

Answer 1

Это прямо в ядре; http://api.jquery.com/slideDown/. Просто вызовите эту функцию в событии onclick ссылки, и все будет хорошо.

$('a.expand').click(function() {
  $('#toc').slideToggle(); // slide up if down, down if up.
});

Answer 2

Для достижения этого точного эффекта вам просто нужно использовать функцию slideToggle () , встроенную в jQuery.

$('#toggleButton').click(function(){
    $('#tableOfContents').slideToggle();
});

Вам нужно будет обернуть оглавление и иметь ссылку / кнопку / любую ширину id = "toggleButton", чтобы активировать ее. Убедитесь, что кнопка находится за оглавлением!

Answer 3

Вы можете использовать методы jQuery .slideDown () и .slideUp.

http://api.jquery.com/slideDown/

Однако что-то такое большое, как это меню, которое вы, вероятно, захотите вызвать на лету с помощью ajaxс функцией обратного вызова на slideDown.

Редактировать: причина, по которой я рекомендую вызывать в меню с помощью AJAX, заключается в том, что из-за проблем с удобством использования / доступностью у экрана есть около 100 ссылок, через которые пользователь клавиатуры все еще может переходить.Пользователю клавиатуры потребовалось бы много времени, чтобы просмотреть все ссылки за пределами экрана, чтобы, наконец, перейти к ссылке «Оглавление», которая активирует меню, а затем переключить вкладку обратно на ту, которую он / она хочет ... ужасно.Меню уже не работает с выключенным JS.(Вместо этого есть ссылка на страницу содержания ниже).Поэтому вызов меню с помощью AJAX и предоставление первой ссылки на фокус меню () - гораздо лучшее решение.

Answer 4

Вы можете проверить эту ссылку -

http://www.webresourcesdepot.com/sliding-top-menu-with-jquery/

http://net.tutsplus.com/tutorials/javascript-ajax/build-a-top-panel-with-jquery/

Вы даже можете узнать больше. Их много.

Answer 5

Да, это mootools Fx.Slide.В jQuery вы должны использовать slideDown (http://api.jquery.com/slideDown/)