2010-11-21 4 views
1

nouveau à jquery et jquerymobile. Tout ce que je veux faire est de cacher le menu principal, et créer un bouton "Menu" sur la barre de navigation supérieure. Lorsque l'utilisateur clique sur ce bouton, une fenêtre contextuelle apparaît avec le "menu supérieur". J'ai triché et sur le mobile.css j'ai tourné le "top-menu" pour afficher: aucun pour le cacher initialement.Aide pour faire le bouton de menu pour jQueryMobile

EDIT

Got it plus, mais pas parfait. Maintenant, sur le menu, cliquez sur le bouton (recherchait onTouch ou onTap mais n'a pas pu trouver d'informations API). Y a-t-il un moyen qu'au lieu de l'apparaître il s'ouvre sur une fenêtre pop-up?

De même, pour une raison quelconque, le thème de données ou l'icône ne s'affiche pas non plus.

$(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. 
     }); 
    }); 
}); 

Répondre

3

Le CSS JQM n'est pas appliqué à ce que vous ajoutez manuellement au DOM. Vous devez appeler .page() sur cet article.

Pour plus de détails voir http://jquerymobiledictionary.dyndns.org/faq.html - question sur les ajouts DOM

[modifier]

Cela pourrait être mieux que le piratage, il: http://jquerymobile.com/demos/1.0a2/#docs/toolbars/bars-fullscreen.html

[en réponse à votre modifier]

Première de tous - essayez de ne pas utiliser javascript pour ce dont vous n'avez pas besoin. Pourquoi remplir l'en-tête avec javascript si vous n'en avez pas besoin? Vous n'avez utilisé aucune variable ici.

Deuxième chose - vous n'avez pas lu mon tutoriel. AUCUN matériel spécifique à jquery mobile ne sera appliqué si vous créez un nouveau contenu DOM après que le document est prêt. Si vous faites cela, vous devez appeler .page() sur le nouveau contenu. C'est pourquoi ça ne marche toujours pas.

événements sont disponibles dans les documents & démos section http://jquerymobile.com/demos/1.0a2/ suffit de cliquer events.

Enfin, il n'y a pas de popups dans les téléphones mobiles. Si vous utilisez une boîte de dialogue, consultez les boîtes de dialogue dans les documents JQM.

Jquery était une approche totalement différente de javascript et jquery mobile est aussi une nouvelle idée. Vos intuitions et votre expérience de jquery resteront inutiles pendant un certain temps, jusqu'à ce que vous ayez l'idée de jqm et à quoi elle sert.

Cela peut arriver plus rapidement si vous lisez un peu sur l'amélioration progressive.

Bonne chance.

Questions connexes