Foros del Web » Programando para Internet » Jquery »

toggle con ul y li

Estas en el tema de toggle con ul y li en el foro de Jquery en Foros del Web. Cordial saludo.. Intento hacer un toggle en ul y li para desplegar un menu con opciones, son tres niveles pero al dar click en el ...
  #1 (permalink)  
Antiguo 10/01/2015, 10:06
 
Fecha de Ingreso: febrero-2013
Ubicación: Cali Colombia
Mensajes: 118
Antigüedad: 11 años, 2 meses
Puntos: 0
toggle con ul y li

Cordial saludo.. Intento hacer un toggle en ul y li para desplegar un menu
con opciones, son tres niveles pero al dar click en el label 1 se activa los otros label
si doy click en cualquier label2 entonces se activan todos los label3 y no el propio.

Código Javascript:
Ver original
  1. <script>
  2. $(document).ready(function(){
  3.         $("ul.subnavegador").hide();
  4.         $("ul.sububnavegador").hide();
  5.         $(".label1").click(function(){
  6.                 $(".subnavegador").toggle(
  7.                         function(){
  8.                                 $(this).parent().find(".label2").click(function(){
  9.                                         slideDown('fast');
  10.                                 });
  11.                         },
  12.                         function(){
  13.                                 $(this).parent().find(".label2").click(function(){
  14.                                         slideUp('fast');
  15.                                 });
  16.                         }
  17.                 );            
  18.         });
  19.         $(".label2").click(function(){
  20.                 $(".sububnavegador").toggle(
  21.                         function(){
  22.                                 $(this).parent().find(".label3").click(function(){
  23.                                         slideDown('fast');
  24.                                 });
  25.                         },
  26.                         function(){
  27.                                 $(this).parent().find(".label3").click(function(){
  28.                                         slideUp('fast');
  29.                                 });
  30.                         }
  31.                 );            
  32.         });
  33.  
  34. });
  35. </script>

Código PHP:
Ver original
  1. <ul class="navegador">
  2.     <? for($i = 0;$i <= 1;$i++){ ?>
  3.     <li id="li_uno">
  4.     <label class="label1"> Nivel 1: </label>
  5.       <ul class="subnavegador">
  6.         <? for($j = 0;$j <= 1;$j++){ ?>
  7.         <li class="desplegable">
  8.            <label class="label2">Nivel 2: </label>
  9.             <ul class="sububnavegador">
  10.               <? for($k = 0;$k <= 2; $k++){ ?>
  11.                 <li >
  12.                        <label class="label3">   Nivel 3: </label>
  13.                 </li>
  14.              <? } ?>   
  15.             </ul>
  16.         </li>
  17.     <? } ?>
  18.        </ul>
  19.     </li>
  20. <? } ?>
  21. </ul>

Etiquetas: javascript, php
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 15:37.