JQuery Mobile Fixe la Barre d'outils et Barre de Pied de page disparaît?

Question

Je suis à l'aide de JQuery Mobile version 4.1 a) à l'aide de:

data-position="fixed"

sur en-tête et pied de page.

Quand j'ai faites défiler le contenu, il disparaît puis réapparaît.

Est-il un moyen pour qu'il reste dans sa position et de ne pas disparaître, chaque fois que je fais défiler la page?

Merci

Answer 1

Ajouter data-tap-toggle="false" par rapport à l'élément

ou

Ajoutez à cela Javascript

$("[data-role=header]").fixedtoolbar({ tapToggle: false });

jQuery Mobile Docs - Événements

Answer 2

J'ai trouvé une solution. Je l'ai testé sur mon projet et il fonctionne comme un charme.

Voici l'URL: https://github.com/yappo/javascript-jquery.mobile.iscroll

C'est la même chose JS solution: AppML.

Aussi, voici une démo:

http://yappo.github.com/projects/jquery.mobile.iscroll/livedemo.html

p.s: Il fonctionne mieux sur mon projet que sur leur démo, donc il vaut la peine d'essayer.

Profiter :o)

Answer 3

J'ai eu des problèmes avec jquery mobile iscroll dans mon projet. Peut-être certains des bibliothèques j'ai été en utilisant interfèrent les uns avec les autres (je suis en utilisant le masquage et de jquery.les modèles avec un tas d'autres choses). Une solution qui a fonctionné pour moi a été le jquery mobile scrollview. Les démos peuvent être consultés ici.

http://jquerymobile.com/test/experiments/scrollview/

Et le code est ici

https://github.com/jquery/jquery-mobile/tree/master/experiments/scrollview/

vous devez inclure

• jquery.easing.1.3.js
• jquery.mobile.scrollview.js
• jquery.mobile.le scrollview.css
• scrollview.js

J'ai utilisé récemment sur jquery mobile projet et cela fonctionne très bien sur l'iphone 3gs. Sur mon ancien android HTC mages, il ne fonctionne pas bien mais aucun de jquery mobile fonctionne bien sur cet appareil. Notez que la scrollview est sous les expériences et n'a pas été ajouté à la principale jquery mobile de projet.

Si vous n'avez pas de chance avec iScroll ou jquery mobile scrollview, le clin d'oeil toolkit est une autre option.

http://www.winktoolkit.org/tutorials/119/

Comme iScroll, je n'ai pas pu obtenir que cela fonctionne avec mon projet particulier, mais je ne pense pas que j'ai vraiment essayé dur.

Answer 4

<div data-role="footer" data-tap-toggle="false"
     data-theme="c" id="footer" data-position="bottom" >
    <h4 align="center" >copyright 2012 @KoshWTF</h4>
    <p>&nbsp;</p>
</div> 

P. S vous pouvez faire pour l'en-tête ainsi si vous avez le moindre problème avec elle. cheers

Answer 5

        $(document).bind("mobileinit", function() {
             $.support.touchOverflow = true;

              $.mobile.touchOverflowEnabled = true;
              $.mobile.fixedToolbars.setTouchToggleEnabled(false);

        });

Les travaux de cette. Testé sous Android 2.3