【问题标题】:Jquery mobile: How to set panel push content only not header and footer?Jquery mobile:如何设置面板推送内容而不是页眉和页脚?
【发布时间】:2015-06-29 08:51:41
【问题描述】:

我有一个带有导航面板的简单页面,我只想推送内容,不包括页眉和页脚。这是我的示例代码:

<div data-role="page" class="jqm-demos" id="tpage" data-title="Panel fixed positioning" data-url="tpage">
    <div id="myhead" data-role="header" data-position="fixed"  style="min-height: 160px;">
    <a href="#nav-panel" data-icon="bars" data-iconpos="notext">Menu</a>
                <h1> Sample header </h1>

    </div><!-- /header -->
    <div role="main" class="ui-content jqm-content jqm-fullwidth">
        <h1>content</h1>
    </div><!-- /content -->
    <div data-role="footer" data-position="fixed">
        <h4>Fixed footer</h4>
    </div><!-- /footer -->
    <div data-role="panel" data-position="left" data-display="overlay" data-theme="b" id="nav-panel">
       panel
    </div><!-- /panel -->

</div> 

我尝试搜索,但我发现只是覆盖而不是推送。

【问题讨论】:

    标签: jquery-mobile panel


    【解决方案1】:

    添加这个:

    /*jquery mobile fix for fixed header*/
    div[data-role=header]{
            position: absolute;
            top: 0px;
            z-index: 9999;
            width: 100%;
    }
    
    div[data-role=page]{
        position: relative;
    }
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2014-07-31
      • 1970-01-01
      • 2011-10-19
      • 2013-06-18
      • 2019-02-17
      • 1970-01-01
      • 2012-07-01
      • 1970-01-01
      相关资源
      最近更新 更多