iScroll 4固定菜单，无法滚动页面的其余部分

Question

我正在使用iScroll作为水平固定位置菜单。它工作得很好，但是我无法在移动浏览器中垂直滚动页面的其余部分。它在pc / mac调整大小的浏览器窗口中工作正常，而不是在移动设备上。我在Android上尝试过Safari，在Android上尝试使用Chrome和Dolphin。

我是如何让页面滚动的？

我玩过vScroll，hScroll等选项，但未能解决问题：

<nav id="mainNav">
    <ul class="pagesIcons bottom">
        <li style="background-color:#000000" class="active selected current youarehere">
            <a href="#" class="inner">
                <div class="buttonIcon">
                    <img src="/content/icons/002.png">
                </div>
                <div class="buttonText">
                    Homepage
                </div>
            </a>
        </li>
        <li style="background-color:#383838" class="">
            <a href="#" class="inner">
                <div class="buttonIcon">
                    <img src="/content/icons/002.png">
                </div>
                <div class="buttonText">
                    Gallery
                </div>
            </a>
        </li>
        <li style="background-color:#5c5c5c" class="">
            <a href="#" class="inner">
                <div class="buttonIcon">
                    <img src="/content/icons/004.png">
                </div>
                <div class="buttonText">
                    Events
                </div>
            </a>
        </li>
        ........
    </ul>
</nav>

我正在初始化它：

var myScroll;
function loaded() {
    myScroll = new iScroll('mainNav', {
        bounce: false
    });
}

document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);

document.addEventListener('DOMContentLoaded', loaded, false);

Answer 1

解决。我只需要删除：

document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);

非常明显。这阻止了'touchmove'上的默认事件。 Durrrrrrr

Answer 2

你可以通过应用这个jquery来解决这个问题，你需要添加你想要滚动的包装类的名称来代替ClassName。如果你仍然遇到问题，请告诉我，我会尝试提供更多帮助。

$('.ClassName').bind('touchmove', function(e){
  e.stopPropagation();
});