hacer una lista desordenada en un menú desplegable

Si tengo este código que muestra en Wordpress, ¿cuál es la forma más fácil de convertir esto en un menú de salto?hacer una lista desordenada en un menú desplegable

<ul class='toc-odd level-1'> 
    <li><a href="1">It's finally here</a></li> 
    <li><a href="2">Improvements</a></li> 
    <li><a href="3">Handling</a></li> 
</ul>

puedo usar jquery como se mostró en este hilo: How to convert unordered list into nicely styled <select> dropdown using jquery?

y si es así, ¿dónde i colocar los ejemplos de código muestran en dicho poste?

Fuente

2012-02-14 Jim

¿Qué es un menú de salto? – ShankarSangoli

1) Sí, 2) En un guión – elclanrs

@ShankarSangoli Supongo que Jim significa uno de esos seleccionados de la vieja escuela que cambiaron la url de cambio de la ventana. – MetalFrog

tal un poco de jQuery :)

Para empezar, si eres nuevo en jQuery, que se habrán dado cuenta de que se puede crear en línea usando jQuery de guión etiquetas dentro de su página web HTML, o puede cree un archivo .js separado que esté vinculado a su archivo html (preferido) utilizando un CDN (check it out here) o proporcione manualmente los archivos de script de escritura. Prefiero usar el CDN de Google porque tienen muchos servidores que probablemente estén más cerca del cliente, y el cliente solo tiene que cargar los scripts una vez a través del CDN.

En su html, proporcione las etiquetas de secuencia de comandos y luego empiece a trabajar con JS y jQuery.

<head> 
<title>your webpage</title> 
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" /> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript"></script> 
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/jquery-ui.min.js" type="text/javascript"></script> 
//BELOW IS YOUR OWN SCRIPT FILE REFERENCE! 
<script src="Scripts/Jscript1.js" type="text/javascript" ></script>

Además, si desea que el intellisense jQuery para trabajar en el archivo de script, todo lo que tiene que hacer es añadir un enlace de referencia en el archivo de secuencia de comandos que está utilizando!

/// <reference path="jquery-1.7.1-vsdoc.js" /> 


$(document).ready(function() { 

$('.toc-odd level-1').hover(
    function() { 
     //show its submenu 
     $('ul', this).slideDown(100); 

    }, 
    function() { 
     //hide its submenu 
     $('ul', this).slideUp(100);   
    } 
);

});

El ejemplo de jQuery anterior es solo 1 forma de los millones que puede implementar para representar su código. Si usted tiene interés en el aprendizaje de una biblioteca rápida y concisa, a continuación, echa un vistazo a la learn jQuery in 30 days.

mejor de la suerte, Ben

Fuente

2012-02-14 15:58:13

Hay sobre cientos de plugins con este propósito ... Una simple búsqueda debe aportar una gran cantidad de resultados como "50 plugins jQuery para el menú desplegable" ..

Algunos resultados se mostrará cómo construir su propio menú como éste "Build a dropdown menu with CSS and jQuery"

Otros resultados darán a usted un plugin que sólo tiene que llamar a una función jQuery para transformar este UL i nto un menú, como "jQuery plugin for dropdown menu"

En ambos casos no es necesario usar exactamente cómo se muestran, sólo se siente la idea y, si es necesario, modificar para adaptarse a su caso ...

Fuente

2012-02-14 16:09:39

Comprobar éste. Más simple

http://jsfiddle.net/Tpf7E/22/

HTML, CSS jQuery &

Fuente

2012-02-14 16:38:37

hacer una lista desordenada en un menú desplegable

Respuesta

Cuestiones relacionadas