1

我是 Jquery Mobile 和 Phonegap 的新手。如 Jquery Mobile 网站所述，我在一个 HTML 页面中创建了一个包含多个页面的应用程序，用于在移动设备中开发应用程序。

我还为每个页面添加了面板。我的问题是，添加面板后，整个页面的向上/向下滚动变得卡住了。如，您必须拖动两次才能滚动页面。当您在 iPhone/iPad 上运行应用程序并且在浏览器上没有问题时会发生这种情况。从页面中删除面板时，此问题不存在。

我已将面板作为页眉、内容和页脚的兄弟包含在内，并且面板工作正常。

可能是什么原因？这是面板html

<div data-role="panel" id="menuPanel3" data-position="right" data-display="push" data-theme="a">
<div data-role="controlgroup" data-corners="false">
<a href='javascript:void(0)' data-corners="false" data-role=button onclick="nav('#wallet')" data-theme="a">Wallet</a>
<a href='javascript:void(0)' data-corners="false" data-role=button data-theme="a">Settings</a>
<a href='javascript:void(0)' data-corners="false" data-role=button data-theme="a">About Us</a>
<a href='javascript:void(0)' data-corners="false" data-role=button onclick=logout() data-theme="a">Logout</a>
</div> 
</div><!-- /panel -->

当我从页面块中删除上述块时，滚动变得很好。

以下是应用的样式..

<style>
    /*this block should go in the styles.css file*/
    .ui-panel-inner {
        padding:0px; /*make the buttons flush edge to edge*/
    }
    .ui-controlgroup {
        margin:0; /*make the buttons flush to the top*/
    }
    #header {
        height:54px;
    }
    #bars-button {
        margin:7px;
    }
</style>

请帮忙...

4

1 回答 1

0

面板必须是 jQuery Mobile 页面内页眉、内容和页脚元素的同级元素。您可以在这些元素之前或之后添加面板标记，但不能介于两者之间。面板不能放置在页面之外，但此限制将在未来版本中删除。

以下是源顺序中页眉、内容和页脚之前的面板示例：

<div data-role="page">          

    <div data-role="panel" id="mypanel">
        <!-- panel content goes here -->
    </div><!-- /panel -->

    <!-- header -->
    <!-- content -->
    <!-- footer -->

</div><!-- page -->

完全按照这些说明进行操作，一切都会好起来的：http: //jquerymobile.com/demos/1.3.0-beta.1/docs/panels/#

我最近使用面板没有任何问题：http ://radio.idev.ge

通过向面板添加 'data-position-fixed="true"' 解决了该问题。

于 2013-09-26T07:24:35.003 回答