Question

我已经在互联网上寻找这个帖子差不多两个月了，但我找不到任何东西。

这是我的代码：

<!DOCTYPE html>
<html>
    <head>
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.css">
        <script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
        <script src="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script>
    </head>
    <body>
        <div data-role="page" id="pageone">
            <div data-role="panel" id="myPanelDefault">
                <h2>Panel Header</h2>
                <p>You can close the panel by clicking outside the panel, pressing the Esc key, by swiping, or by clicking the button below:</p>
                <a href="#pageone" data-rel="close" class="ui-btn ui-btn-inline ui-shadow ui-corner-all ui-btn-a ui-icon-delete ui-btn-icon-left">Close panel</a>
            </div>

            <div data-role="panel" id="myPanelFixed" data-position-fixed="true">
                <h2>Panel Header</h2>
                <p>You can close the panel by clicking outside the panel, pressing the Esc key, by swiping, or by clicking the button below:</p>
                <a href="#pageone" data-rel="close" class="ui-btn ui-btn-inline ui-shadow ui-corner-all ui-btn-a ui-icon-delete ui-btn-icon-left">Close panel</a>
            </div>

            <div data-role="header">
                <h1>Page Header</h1>
            </div>

            <div data-role="main" class="ui-content">
                <p>Click on both buttons and start to scroll the page.</p>
                <a href="#myPanelDefault" class="ui-btn ui-btn-inline ui-corner-all ui-shadow">Open Default Panel</a>
                <a href="#myPanelFixed" class="ui-btn ui-btn-inline ui-corner-all ui-shadow">Open Panel with data-position-fixed="true"</a>

                <p><b>Tip:</b> To see the effect of the data-position-fixed="true" attribute, try to resize the window if the scrollbar is not available.</p>

                <p>Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..Some text to enable scrolling..</p><br>
            </div>

            <div data-role="footer">
                <h1>Page Footer</h1>
            </div>
        </div>
    </body>
</html>

以上代码是在面板打开时固定面板的演示。我希望知道如何在面板打开时修复内容或ui内容。因此，即使面板向上或向下滚动，ui内容也会保持固定。

谢谢你， Zamm。

如何在面板在jquery mobile上滚动时修复ui内容

0 个答案: