1

我目前正在尝试使用 jQuery mobile 构建一个 Facebook 风格的 Web 应用程序。我的主要问题是用户无法同时滚动导航栏和内容。我尝试了许多基于 css 的解决方案，但是虽然我的普通浏览器显示一切正确，但我的所有移动设备都拒绝同时显示两个滚动条。

所以我尝试iScroll用iScrollview. 它适用于所有内容，但适用于我的可滑动菜单栏。我不知道问题可能出在哪里。一旦添加页面iScrollview似乎就会忽略该data-iscroll属性。

<body class="ui-mobile-viewport">
<div id="menu" data-role="content" data-iscroll> <!--Menu-->
  <div id="memberDetails">
    <h3>Username</h3>
  </div>
  <ul>
    <li class="menuDivider" >MENUDIVIDER</li>
    <li class="active"><a href="#home" class="contentLink" data-transition="none"><span class="icon" id="home"></span><span class="text">Home</span></a></li>
    <li><a href="#page1" class="contentLink" data-transition="none" data-prefetch><span class="icon" id="page1"></span><span class="text">Page One</span></a></li>
    <li><a href="#page2" class="contentLink" data-transition="none" data-prefetch><span class="icon" id="page2"></span><span class="text">Page Two</span></a></li>
    <li><a href="#page3" class="contentLink" data-transition="none" data-prefetch><span class="icon" id="page3"></span><span class="text">Page Three</span></a></li>
    <li><a href="#page8" class="contentLink" data-transition="none" data-prefetch><span class="icon" id="page8"></span><span class="text">Page Eight</span></a></li>
    <li class="menuDivider" >MENUDIVIDER</li>
  </ul>
</div>

<!--/Menu--> 

<!--page Home-->

<div data-role="page" class="pages ui-page ui-body-c ui-page-active" id="home" data-url="home" tabindex="0" style="margin-left: 0px; min-height: 882px; ">
  <div data-role="header" class="ui-header ui-bar-a" role="banner"> <a href="#" class="showMenu menuBtn" data-theme="a"><span class="ui-btn-inner ui-btn-corner-all" aria-hidden="true"><span class="ui-btn-text">Menu</span></span></a>
    <h1 class="ui-title" tabindex="0" role="heading" aria-level="1">Home</h1>
  </div>
  <!-- /header -->
  <div id="logo"><img src="files/images/wig_logo.png" alt="wig-logo" width="54" height="25"></div>
  <!-- /logo -->
  <div data-role="content" class="ui-content" role="main">
    <p>Text</p>
  </div>
  <!-- /content --> 
</div>
<!-- /page Home-->
</body>

我正在使用 jQuery 1.8.2、JQM 1.2.0。这slideeffect是通过基本上将内容的边距设置为菜单的宽度来完成的。如果您需要任何进一步的信息，请告诉我。

4

0 回答 0