Foros del Web » Creando para Internet » CSS »

menu dropdown celulares no anda

Estas en el tema de menu dropdown celulares no anda en el foro de CSS en Foros del Web. Hola, tengo mi pagina http://www.santillineumaticos.com/ donde tengo armado el menu con el dropdown de bootstrap 3.5 en los navgadores de pc se ve bien, pero ...
  #1 (permalink)  
Antiguo 31/03/2016, 21:32
Avatar de destor77  
Fecha de Ingreso: noviembre-2004
Ubicación: Gálvez, Santa Fe, Argentina
Mensajes: 2.654
Antigüedad: 19 años, 6 meses
Puntos: 43
menu dropdown celulares no anda

Hola,
tengo mi pagina http://www.santillineumaticos.com/ donde tengo armado el menu con el dropdown de bootstrap 3.5 en los navgadores de pc se ve bien, pero cuando intento verlo desde un celular, al desplegar las opciones del menu, si quiero hacer click en el link no me lleva a la url sino que se cierra el menú y no se porque hace eso. Alguien me puede dar una mano?

mi menu:
Código HTML:
Ver original
  1. <nav class="navbar navbar-default">
  2.             <div class="container-fluid">
  3.                 <!-- Brand and toggle get grouped for better mobile display -->
  4.                 <div class="navbar-header">
  5.                     <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
  6.                         <span class="sr-only">Toggle navigation</span>
  7.                         <span class="icon-bar"></span>
  8.                         <span class="icon-bar"></span>
  9.                         <span class="icon-bar"></span>
  10.                     </button>
  11.                     <a class="navbar-brand" href="<?php echo base_url();?>">INICIO</a>
  12.                 </div>
  13.  
  14.                 <!-- Collect the nav links, forms, and other content for toggling -->
  15.                 <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
  16.                     <ul class="nav navbar-nav">
  17.                         <li class="dropdown">
  18.                             <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">EMPRESA <span class="caret"></span></a>
  19.                             <ul class="dropdown-menu">
  20.                                 <li><a href="<?php echo base_url('empresa');?>">La Empresa</a></li>
  21.                                 <li><a href="<?php echo base_url('empresa/valores');?>">Misión - Visión - Valores</a></li>
  22.                             </ul>
  23.                         </li>
  24.                         <li><a href="<?php echo base_url('historia');?>">HISTORIA</a></li>
  25.                        
  26.                         <?php
  27.                         $segments = $this->uri->segment_array();
  28.                         if (!empty($segments))
  29.                         {?>
  30.                         <li><a href="<?php echo base_url('recursos-humanos');?>">R. HUMANOS</a></li>
  31.                         <li class="dropdown">
  32.                             <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">TRUCK CENTER <span class="caret"></span></a>
  33.                             <ul class="dropdown-menu">
  34.                                 <li><a href="<?php echo base_url('truck-center/nuestro-servicio');?>">NUESTRO SERVICIO</a></li>
  35.                                 <li><a href="<?php echo base_url('truck-center/tecnologia');?>">TECNOLOGIA</a></li>
  36.                             </ul>
  37.                         </li>
  38.                         <li class="dropdown">
  39.                             <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">SERVICIO LIVIANO <span class="caret"></span></a>
  40.                             <ul class="dropdown-menu">
  41.                                 <li><a href="<?php echo base_url('servicio-liviano/nuestro-servicio');?>"title="Nuestro Servicio">NUESTRO SERVICIO</a></li>
  42.                                 <li><a href="<?php echo base_url('servicio-liviano/consejos');?>"title="consejos">CONSEJOS</a></li>
  43.                                 <li role="presentation" class="divider"></li>
  44.                                 <li><a href="<?php echo base_url('servicio-liviano/alineacion');?>" title="Alineación">ALINEACIÓN</a></li>
  45.                                 <li><a href="<?php echo base_url('servicio-liviano/balanceo');?>" title="Balanceo">BALANCEO</a></li>
  46.                                 <li><a href="<?php echo base_url('servicio-liviano/rotacion');?>" title="Rotación">ROTACIÓN</a></li>
  47.                                 <li><a href="<?php echo base_url('servicio-liviano/colocacion');?>" title="Colocación">COLOCACIÓN</a></li>
  48.                             </ul>
  49.                         </li>
  50.                         <li class="dropdown">
  51.                             <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">PRODUCTOS<span class="caret"></span></a>
  52.                             <ul class="dropdown-menu">
  53.                                 <li><a href="<?php echo base_url('productos');?>" title="Productos">Productos</a></li>
  54.                                 <li><a href="<?php echo base_url('productos/ruedas-aluminio');?>"title="MS Ruedas">MS Ruedas</a></li>
  55.                             </ul>
  56.                         </li>
  57.                         <?php
  58.                         }
  59.                         else
  60.                         {?>
  61.                         <li><a href="<?php echo base_url('recursos-humanos');?>">RECURSOS HUMANOS</a></li>
  62.                         <?php
  63.                         }  
  64.                         ?>
  65.                        
  66.                     </ul>
  67.                    
  68.                     <ul class="nav navbar-nav navbar-right">
  69.                         <li class="contacto"><a href="<?php echo base_url('contacto');?>" title="Contacto">CONTACTO</a></li>
  70.                     </ul>
  71.                 </div><!-- /.navbar-collapse -->
  72.             </div><!-- /.container-fluid -->
  73.         </nav>

y tengo esto en main.js:
Código Javascript:
Ver original
  1. $(".dropdown-menu > li > a.trigger").on("click",function(e){
  2.             var current=$(this).next();
  3.             var grandparent=$(this).parent().parent();
  4.             if($(this).hasClass('left-caret')||$(this).hasClass('right-caret'))
  5.                 $(this).toggleClass('right-caret left-caret');
  6.             grandparent.find('.left-caret').not(this).toggleClass('right-caret left-caret');
  7.             grandparent.find(".sub-menu:visible").not(current).hide();
  8.             current.toggle();
  9.             e.stopPropagation();
  10.         });
  11.         $(".dropdown-menu > li > a:not(.trigger)").on("click",function(){
  12.             var root=$(this).closest('.dropdown');
  13.             root.find('.left-caret').toggleClass('right-caret left-caret');
  14.             root.find('.sub-menu:visible').hide();
  15.         });

desde ya muchas gracias
  #2 (permalink)  
Antiguo 03/04/2016, 14:57
 
Fecha de Ingreso: diciembre-2014
Ubicación: Madrid
Mensajes: 26
Antigüedad: 9 años, 4 meses
Puntos: 0
Respuesta: menu dropdown celulares no anda

Hola Destor,

Yo tenía el mismo problema hace tiempo y por lo que pude leer, han desactivado los menús secundarios de Bootstrap, por lo que creo que no hay forma de hacerlo funcionar con esta librería.

Te recomiendo busques en bootsnip.com, alguna de las opciones que funcione bien.

Saludos,

Etiquetas: bootstrap
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 18:40.