0

我在我的项目中使用 jquery mobile 并实现了页眉和页脚工具栏。

我想做的是：

总是当我打开一个页面时，我希望工具栏被隐藏，只有当我在触摸屏上单击 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}
4

1 回答 1

1

给出包含声明“display：none”的页眉和页脚 CSS 类，并使用绑定到的 javascript 触摸事件处理程序window通过删除该类来显示它们。还要注意 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>
于 2013-06-19T15:52:26.220 回答