Ayuda con la fabricación de botón de menú para jquery mobile

StackOverflow https://stackoverflow.com/questions/4239115

  •  26-09-2019
  •  | 
  •  

Pregunta

nuevo en jQuery y jquery mobile.

Todo lo que quiero hacer es esconder el menú principal, y crear un botón "Menú" en la parte superior de barra de navegación. Cuando el usuario hace clic en este botón, una ventana emergente aparece con el "top-menú".

Me engañó y en el mobile.css me dio el "top-menú" para mostrar:. Ninguno que inicialmente ocultarlo

Editar

que se acercaba, pero no es perfecto. Ahora el menú del botón (estaba buscando onTouch o Ontap pero no pudo encontrar información API) que aparezca el menú. ¿Hay una manera que en lugar de que aparezca se abre en una ventana pop-up?

También, por alguna razón tema de los datos o el icono no aparece tampoco. 

$(document).ready(function(){
    $('#header').append('<div data-role="navbar"><ul><li class="mainMenu"><a href="#" data-iconpos="top" data-icon="grid" data-theme="b">Menu</a></li><li><a href="#">facebook</a></li><li><a href="#">Twitter</a></li></ul></div>');
    $('.mainMenu').click(function() {
      $('#top-menu').toggle('fast', function() {
        // Animation complete.
      });
    });
});
¿Fue útil?

Solución

El CSS JQM no se aplica a lo que se agrega manualmente a la DOM. Tienes que llamar .page() sobre ese tema.

Para más detalles ver http://jquerymobiledictionary.dyndns.org/faq.html - pregunta sobre adiciones DOM

[editar]

Esto podría ser mejor que la piratería es: http: // jquerymobile.com/demos/1.0a2/#docs/toolbars/bars-fullscreen.html

[como una respuesta a su editar]

En primer lugar - Trate de no usar javascript por lo que no es necesario. ¿Por qué llenar la cabecera con javascript si no lo necesita? Que no ha utilizado ninguna variable de allí.

La segunda cosa - usted no ha leído mi tutorial. NO jQuery cosas específicas móvil se aplicará si se crea un nuevo contenido DOM después documento está listo. Si lo hace, usted tiene que llamar .page() el nuevo contenido. Es por eso que aún no funciona.

Eventos están disponible en la documentación y demos la sección http://jquerymobile.com/demos/1.0a2/ sólo hay que hacer clic events.

Por último - no hay ventanas emergentes en los teléfonos móviles. Si un cuadro de diálogo ción echar un vistazo a los diálogos de los documentos JQM.

Jquery fue un enfoque totalmente diferente a javascript y jQuery Mobile también es una idea nueva. Sus intuiciones y experiencias de jQuery sería desperdiciado durante algún tiempo, hasta que se obtiene la idea de JQM y para qué sirve.

Esto puede ocurrir más rápido si usted lee un poco en la mejora progresiva.

Buena suerte.

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top