如何在jquery mobile中使页面上的侧板保持静态

How to make side panel static on the page in jquery mobile

本文关键字：静态 jquery mobile      更新时间：2023-09-26

目前我使用的是侧面板，在侧面板中，单击按钮时，它只能在页面上一直显示的位置显示。有可能吗。当显示侧面板时，页面的某些部分在哪里不可见，因为它应该通过显示所有内容来调整到屏幕上。

有人能帮我吗？谢谢。

<div data-role="page" id="pageone" class="type-interior">
    <div data-role="content" style="padding:0em;">
        <a href="#nav-panel" data-icon="bars" data-iconpos="notext">Menu</a>
        <div class="content-primary">
//here page content was there
</div>
<div data-role="panel" data-position="left" data-position-fixed="true" data-display="reveal" id="nav-panel" data-theme="a">
</div>
</div>

根据jQuery移动文档：

面板必须是jQueryMobile页面中页眉、内容和页脚元素的同级元素。

此外，面板在默认情况下是隐藏的，但您可以在pagecreate事件中打开它：

  • HTML:

    <div data-role="page" id="pageone" class="type-interior">
    <div class="ui-content" style="padding:0em;">
        <a href="#nav-panel" data-icon="bars" data-iconpos="notext">Menu</a>
        <div class="content-primary">
            //here page content was there
        </div>
    </div>
    <div data-role="panel" data-position="left" data-dismissible="false" id="nav-panel" data-theme="a">
        <p>Test</p>
    </div>
</div>

  • JS:

    $(document).on('pagecreate', function() {
    $("#nav-panel").panel("open");
});

这是演示。

相关文章：