如何隱藏和顯示頁面顯示頁眉和頁腳工具欄

Question

即時通訊工作與jquery移動在我的項目和我實現頁眉和頁腳工具欄。

我嘗試做的是：

一直當我打開一個網頁，我想，工具欄被隱藏，只有當我點擊1次在觸摸屏上我想打開它們。

我從我的一個朋友的腳本和它的作品，

，但我必須做一個雙擊觸摸屏打開他們...

存在反正只有1做到這一點點擊？

注：我已經在我的項目數data-role="pages"

我的代碼：

HTML5：

<div data-role="header" data-theme="a" data-position="fixed" data-id="footer" data-fullscreen="true" class="hidden">TESTE</div> 

<div data-role="footer" data-theme="a" data-position="fixed" data-id="footer2" data-fullscreen="true" class="hidden">TESTE</div>  

腳本：

function enableHeaderFooter() { 
    $(document).off("touchend", enableHeaderFooter); 
    $("header, footer").removeClass("hidden"); 
    } 
    $(document).on("touchend", enableHeaderFooter); 

CSS：

.hidden{display:none} 

Answer 1

提供包含聲明的頁眉和頁腳的CSS類「顯示：無」，並使用綁定到window的JavaScript的觸摸事件處理程序通過消除類來顯示它們。 另請注意，data-role =「header」有點愚蠢，因爲html有一個元素。其次，請注意，您已經給id=footer這是保證導致問題。

<header class="hidden" ...>...</header> 
... 
<footer class="hidden" ...>...</footer> 

+

<script> 
    function enableHeaderFooter() { 
    $(document).off("touchend", enableHeaderFooter); 
    $("header, footer").removeClass("hidden"); 
    } 
    $(document).on("touchend", enableHeaderFooter); 
</script>