Foros del Web » Programando para Internet » Javascript »

Menu para móviles no funciona

Estas en el tema de Menu para móviles no funciona en el foro de Javascript en Foros del Web. Buenos días a todos! Intento hacer funcionar un menu para móviles. Estoy bastante perdido respeto al Js. Por eso, os voy a poner directamente los ...
  #1 (permalink)  
Antiguo 12/08/2012, 02:37
 
Fecha de Ingreso: junio-2006
Mensajes: 65
Antigüedad: 17 años, 10 meses
Puntos: 0
Menu para móviles no funciona

Buenos días a todos!

Intento hacer funcionar un menu para móviles.
Estoy bastante perdido respeto al Js.
Por eso, os voy a poner directamente los códigos (Js,css,html) y algunos comentarios.

Empezamos con el html:

Código HTML:
<ul id="mb_menu" >
        <li>
          <a class="" href="blog.html">|B l o g|</a>
        </li>
        <li>
          <a class="" href="password.html">|A r c h i v e| </a>
        </li>
        <li>
          <a class="" href="bio.html">|B i o - C o n t a c t|</a>
        </li>
        <li>
          <a class="" href="corporate.html">|C o r p o r a t e|</a>
        </li>
        <li>
          <a class="" href="stories.html">|S t o r i e s|</a>
        </li>
        <li>
          <a class="active" href="index.html">|H o m e|</a>
        </li>
      </ul> 


<div class="mobile_menu">
    	<select id="mobile_select">
        </select>
    </div> 
el Js:

Código Javascript:
Ver original
  1. $(document).ready(function() {
  2.    
  3.     $('.mb_menu').find('li:has(ul)').addClass('has-menu');
  4.     $('.mb_menu').find('li').each(function(){
  5.         cur_link = $(this).children("a");
  6.         if (!$(this).parent('ul').hasClass('sub-menu'))  {
  7.             $('#mobile_select').append('<option value='+cur_link.attr("href")+'>'+cur_link.text()+'</option>');
  8.         }
  9.         else if (!$(this).parent('ul').hasClass('level1')) {
  10.             $('#mobile_select').append('<option value='+cur_link.attr("href") +'> -- '+cur_link.text()+'</option>');
  11.         }
  12.         else {
  13.             $('#mobile_select').append('<option value='+cur_link.attr("href") +'> - '+cur_link.text()+'</option>');
  14.         }
  15.     });
  16.     //$('.sub-menu').animate({'opacity' : '0'},1);
  17.    
  18.     $('#mobile_select').change(function(){
  19.         window.location.hash = $(this).find                                
  20.         select_val = $(this).val();
  21.         if (select_val.substr(0,1) == '#') {
  22.         window.location.hash = select_val;
  23.         }      
  24.     });
  25.    
  26. })(jQuery);

Y para terminar el css:

.
Código CSS:
Ver original
  1. mobile_menu { display:block!important; height:24px; position:fixed; bottom:0px; background:#FFF; left:0px; width:100%}
  2.     .mobile_select { width:100%; height:24px;}
  3.     .mobile_select option { text-transform:uppercase}

Si al menu (en html) le añado class="menu" después del ul id="mb_menu", me sale el menu pero no me funciona los enlace y el menu de la página normal.

Me gustaría que funcionará con el ul id="mb_menu" únicamente pero no sé que tengo que modificar en el js.

Gracias a todos
  #2 (permalink)  
Antiguo 12/08/2012, 20:21
 
Fecha de Ingreso: agosto-2012
Mensajes: 37
Antigüedad: 11 años, 8 meses
Puntos: 12
Respuesta: Menu para móviles no funciona

Para que funcione quita el javascript y fuera problemas
__________________
Pedro Gutiérrez, diseñador y desarrollador web freelance en Toledo,
busco soluciones a los proyectos web que me propongas.

Visita mi web-blog: http://xitrus.es
  #3 (permalink)  
Antiguo 13/08/2012, 01:14
 
Fecha de Ingreso: junio-2006
Mensajes: 65
Antigüedad: 17 años, 10 meses
Puntos: 0
Respuesta: Menu para móviles no funciona

Cita:
Iniciado por pedrogp9693 Ver Mensaje
Para que funcione quita el javascript y fuera problemas
Buenos días Pedro.

Cuando quito el Js, me desaparece el menu (recordar que tengo que añadir al
Código:
"ul id="mb_menu" class"menu"
para que el menu se vea).

Si sabes como hacerlo funcionar con el mobile_device y sin el javascript... genial.
Sino el problema sigue el mismo; cuando hago clic sobre le menú, este no me va a buscar la página.

Una pequeña solución...

Gracias

Etiquetas: funcion, html, js, select
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 12:59.