web-dev-qa-db-fra.com

Dans Jquery mobile, les en-têtes et les pieds de page se cachent toujours lorsque vous cliquez dans la page?

J'ai besoin d'en-tête et de pied de page toujours en position fixe.

Je ne veux pas comme la page d'URL ci-dessous. Que vais-je faire?. Aidez-moi ........ http://jquerymobile.com/demos/1.0b1/#/demos/1.0b1/docs/toolbars/bars-fullscreen.html

(Dans l'URL ci-dessus, si vous avez cliqué à l'intérieur de la page. L'en-tête et le pied de page seront masqués). Je ne veux pas comme ça

jqueryjquery-mobile
27
sadeesh kumar

Si quelqu'un trouve encore cette question et se rend compte que ce qui précède ne fonctionne plus, comme je l'ai fait, la bonne façon de le faire (ce qui est correct aujourd'hui, le 23 mai 2012) est la suivante:

<div data-role="footer" data-position="fixed" data-tap-toggle="false">

86
ahren

Utilisez data-tap-toggle="false" AND data-hide-during-focus="".

La seconde empêche les barres d’outils fixes de cacher lorsque vous cliquez sur une entrée .

16
fjsj

data-tap-toggle="false" m'a sauvé le même mal de tête!

C'est un bon long métrage. Je suis surpris de l'avoir manqué dans la documentation.

5
Foo JH

J'ai réussi à le faire en utilisant un pied de page fixe:

<div data-role="footer" data-position="fixed"> 
    <div data-role="navbar"> 
        <ul> 
            <li></li> 
            <li></li> 
            <li></li> 
        </ul> 
    </div> 
</div>

et du javascript:

<script type="text/javascript">
    $('#containerPage').live('pagecreate', function (event) {

        $.fixedToolbars.setTouchToggleEnabled(false);

    });
</script>

où #containerPage est ma page principale:

<div data-role="page" id="containerPage" data-fullscreen="true">
..
</div>

J'ai essayé et testé cette solution avec jQuery Mobile v1.0rc1. téléchargé le 13 octobre 2011

5
LeftyX

Je me rends compte que cette question est datée, mais cela ne m'a pas aidé à 100%. Ci-dessous, la solution à laquelle je suis arrivé après quelques recherches sur Google raffinées, a décidé de l'afficher ici car c'était mon premier résultat. 

Mon problème était que l'en-tête et le pied de page se masquaient lorsque vous appuyez sur une entrée, que le comportement par défaut soit utilisé ou non. J'utilisais l'incroyable DateBox. 

Mettre à jour manuellement l'en-tête/le pied de page du DOM avec data-tap-toggle = 'false' n'a rien fait, mais cela m'aurait fait gagner du temps: 

$("[data-role=header]").fixedtoolbar({ tapToggleBlacklist: "input[data-role=datebox]" });
$("[data-role=footer]").fixedtoolbar({ tapToggleBlacklist: "input[data-role=datebox]" });

Pour une raison quelconque, la désactivation de cette touche a résolu mon problème et m'a montré un raccourci pour le désactiver sur un grand nombre de pages. 

1
omgz0r

data-tap-toggle = "false" fonctionne correctement avec jQueryMobile 1.1.0 et PhoneGap 2.2.0

1
Stancho Stanchev

data-hide-during-focus="" est uniquement pour le type d'entrée qui nécessite une attention particulière, si vous cliquez n'importe où dans la page et que le problème survient, vous devez utiliser data-tap-toggle="false". mettre cela seulement dans la position fixe div

<div data-role="footer" data-position="fixed" 
   data-tap-toggle="false" data-hide-during-focus="" data-theme="b"></div>
0
M'hammad M'ssabeh