Вопрос

Я ищу выпадающее меню JavaScript.

Это должно быть самое простое и элегантное доступное меню, которое также работает в IE6 и Firefox 2.Было бы прекрасно, если бы это работало с ненумерованным списком (ul) таким образом, пользователь может использовать страницу без поддержки JavaScript.

Какой из них вы рекомендуете и где я могу найти код к такому меню?

Это было полезно?

Решение

Я думаю, что меню jquery superfish фантастическое и простое в использовании:

http://users.tpg.com.au/j_birch/plugins/superfish/

Javascript - это не требовалось, и он основан на простых допустимых списках неупорядоченности ul.

Другие советы

Отдельный список - Выпадающие списки

Я бы использовал решение только для css, подобное приведенному выше, чтобы пользователь по-прежнему получал выпадающие меню, даже если javascript отключен.

Вот мой ответ с использованием jQuery:


jQuery.fn.ddnav = function() {
        this.wrap("");
        this.each(function() {
                var sel = document.createElement('select');
                jQuery(this).find("li.label, li a").each(function() {
                        jQuery("<option>").val(this.href ? this.href : '').html(jQuery(this).html()).appendTo(sel);
                });
                jQuery(this).hide().after(sel);
        });
        this.parent().find("select").after("<input type=\"button\" value=\"Go\">");
        var callback = function(button) {
                var url = jQuery(button.target).parent("div").find("select").val();
                if(url.length)
                        window.open(url, "_self")
        };
        this.parent().find("input[type='button']").click(callback);
        this.parent().find("select").change(callback);
        return this;
};

А затем в вашем готовом обработчике:


  $("ul.dropdown_nav").ddnav();

Но я бы хотел отметить, что это ужасно с точки зрения удобства использования.Лучше использовать список и показывать пользователям все опции сразу, и лучше не переходить после выбора и / или требовать нажатия другой кнопки, чтобы попасть туда, куда они хотят.

Я думаю, вам лучше никогда не использовать вышеприведенное (а код написал я!).

Для пуриста: http://www.grc.com/menudemo.htm Абсолютно никакого JavaScript, только чистый css - и работает практически со всеми браузерами.

Небольшая настройка может сделать их такими же хорошими, как модные меню (jQuery и т.д.).

Но мы также использовали jQuery, YUI!и другие.ЮИ!имеет встроенные отличные параметры доступности, если это требуется для меню на базе JavaScript.

-- Эндрю

Я пользуюсь этим:

http://www.tanfa.co.uk/css/examples/menu/vs7.asp

Выпускается как в вертикальном, так и в горизонтальном исполнении.

Мне нравится stickman's аккордеон, который в зависимости от того, как вы хотите, чтобы он вел себя, может дать приятный эффект.

Я был (беззастенчивым) поклонником Yahoo!Библиотека пользовательского интерфейса. У них хорошая система меню это легко реализовать.Отличная кроссбраузерная поддержка.

Вероятно, вы также можете получить нечто подобное из других популярных фреймворков Javascript, таких как jQuery.

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top