Question

每次滚动时，有没有人知道如何阻止固定导航栏淡入淡出。我正在使用jquerymobile 1.0.1以及以下代码，但我无法忍受导航栏如何淡入和淡出：

<div data-role="footer" data-id="foo1" data-position="fixed">
    <div data-role="navbar">
        <ul>
            <li><a href="footer-persist-a.html" class="ui-btn-active ui-state-persist">Friends</a></li>
            <li><a href="footer-persist-b.html">Albums</a></li>
            <li><a href="footer-persist-c.html">Emails</a></li>
            <li><a href="footer-persist-d.html">Emails</a></li>
            <li><a href="footer-persist-e.html">Emails</a></li>

        </ul>
    </div><!-- /navbar -->
</div><!-- /footer -->

我不仅仅想要“切换”修复。我希望它100％可见100％可见。想法？

Answer 1

对于JQM 1.1，您实际上在页脚上设置了data-tap-toggle =“false”。

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

我喜欢这样做以在每个页面以及每个固定的工具栏，页眉或页脚中禁用tapToggle：

$(document).on('pageinit','[data-role=page]', function(){
    $('[data-position=fixed]').fixedtoolbar({ tapToggle:false });
});

这样我就不必一遍又一遍地输入data-tap-toggle =“false”。

然后，如果你使用JQM 1.0.1：

$('[data-role=page]').live('pageinit', function(){
    $.mobile.fixedToolbars.setTouchToggleEnabled(false);
});

Answer 2

这是JQM 1.0.x用户中常见的不满。他们的开发人员在最新版本中切换了您引用的动态定位行为。从JQM 1.1开始，它们使用不会褪色的真正固定工具条。 JQM的稳定版本应该很快出来。在此之前，您可以使用版本1.1-rc1

旧版本的JQM中有一个解决方案，但这仅适用于ios 5：

$(document).bind("mobileinit", function(){
  $.mobile.touchOverflowEnabled = true ;
});

Answer 3

您可以将data-tap-toggle="true"属性添加到data-role="footer"元素，以禁用点击淡入淡出功能：

tapToggle boolean

默认值：true

启用或禁用用户切换工具栏可见性的功能   点击屏幕（或点击，鼠标用户）。这个选项也是   作为数据属性公开：data-tap-toggle =“”true“”

$（“[data-role = header]”）。fixedtoolbar（{tapToggle：true}）;注意：这个   行为以前可配置如下，但从版本1.1开始   不再支持此语法：

$ .mobile.fixedToolbars .setTouchToggleEnabled（false）;

来源：http://jquerymobile.com/demos/1.1.0-rc.1/docs/toolbars/bars-fixed-options.html

这应该让您的工具栏始终保持原状。

JQueryMobile褪色导航栏

3 个答案: