是否可以让 JqueryMobile 面板在里面滚动但它后面的页面保持静态?我正在尝试创建一个像 facebook 这样的大菜单,但页面也总是滚动,而不仅仅是面板内的内容。
我试过了:
<style type="text/css">
#mypanel {
overflow: scroll !important;
}
</style>
<div data-role="page" id="page">
<div class="my-page-big-content">ALL THE CONTENT OF MY PAGE</div>
<div data-role="panel" id="mypanel" data-position="left" data-display="overlay" data-position-fixed="true">
<div class="panel-header">
<p>My Panel header<a href="#mypanel" data-rel="close">Close My Panel</a></p>
</div>
<div class="panel-content">
<ul class="my-menu">
<li><a href=#>Menu item 1</a></li>
<li><a href=#>Menu item 1</a></li>
<li><a href=#>Menu item 1</a></li>
<li><a href=#>Menu item 1</a></li>
<li><a href=#>Menu item 1</a></li>
<ul>
</div>
</div>
</div>
<script>
$(document).bind('panelopen', function (e, data) {
$('body').css("overflow", "hidden");
});
$(document).bind('panelclose', function (e, data) {
$('body').css("overflow", "auto");
});
</script>