javascript - menus - menu vertical desplegable css accordion

¿Cuál es el mejor menú desplegable de Javascript?

Question

Estoy buscando un menú desplegable de JavaScript.

Debería ser el menú accesible más simple y elegante que funciona en IE6 y Firefox 2 también. Estaría bien si funcionara en una lista no numerada ( ul ) para que el usuario pueda usar la página sin soporte de JavaScript.

¿Cuál recomienda y dónde puedo encontrar el código para dicho menú?

Answer 1

Aquí está mi respuesta usando 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;
};

Y luego en su controlador listo:

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

Pero señalaría que estos son terribles para la usabilidad. Es mejor usar una lista y mostrarle a la gente todas las opciones a la vez, y es mejor no irse después de una selección y / o requerir que se presione un botón diferente para llegar a donde quieren.

Creo que es mejor que nunca uses lo anterior (¡y escribí el código!)

Answer 2

Creo que el menú jquery superfish es fantástico y fácil de usar:

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

No se requiere Javascript, y está basado en listas simples de orden de usuarios.

Answer 3

He sido un fanático (descarado) de Yahoo! Biblioteca de interfaz de usuario. Tienen un buen sistema de barra de menú que es fácil de implementar. Gran soporte para navegadores cruzados

Probablemente también pueda obtener algo similar de otros frameworks populares de Javascript, como jQuery.

Answer 4

Me gusta el acordeón de Stickman , que dependiendo de cómo quieras que se comporte puede ser un buen efecto.

Answer 5

Para los puristas: http://www.grc.com/menudemo.htm Absolutamente no hay JavaScript, pure-css solamente, y funciona con prácticamente todos los navegadores.

Un pequeño ajuste puede hacer que se vean tan bien como los menús sofisticados (jQuery, etc.)

¡Pero también hemos usado jQuery, YUI! y otros. YUI! tiene excelentes opciones de accesibilidad integradas, si eso es un requisito para los menús activados por JavaScript.

- Andrew

Answer 6

Yo uso este:

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

Viene en sabores verticales y horizontales.

Answer 7

A List Apart - Desplegables

Utilizaría una solución de solo CSS como la anterior, de modo que el usuario aún tenga menús desplegables incluso con javascript desactivado.