Javascript safari(ios)上的侧菜单滚动滞后

Javascript safari(ios)上的侧菜单滚动滞后,javascript,html,css,mobile-safari,Javascript,Html,Css,Mobile Safari,我有一个移动网站,它有一个简单的侧菜单栏和滚动,当在safari上滚动菜单时,它会滞后很多(难以滚动) 以下是html: <body> <div id="menu_background" onclick="toggleMenu()"></div> <div id="menu"> <ul> <li> <div>item 1</div>

我有一个移动网站,它有一个简单的侧菜单栏和滚动,当在safari上滚动菜单时,它会滞后很多(难以滚动)

以下是html:

<body>
    <div id="menu_background" onclick="toggleMenu()"></div>
    <div id="menu">
        <ul>
        <li>
        <div>item 1</div>
        </li>
            //other items goes here
    </ul>
    </div>
    <div id="global_container">
        //some content goes here
    </div>
</body>
还有javascript:

var menuShown = false;
function toggleMenu(){
    var menu = document.getElementById("menu");
    var menuBackground = document.getElementById("menu_background");
    var globalContainer = document.getElementById("global_container");
    if(!menuShown){
        menuShown = true;
        menuBackground.style.visibility = "visible" ;
        menu.style.width="60%";
        menu.style.display="block";
        menu.style.overflowY="auto";
        globalContainer.style.position="fixed";
        globalContainer.style.right="62%";  
    }
    else{
        menuShown = false;
        menuBackground.style.visibility = "hidden" ;
        menu.style.width="0%";
        menu.style.display="none";
        menu.style.overflowY="hidden";
        globalContainer.style.position="static";
    }
}
我没有包括html的其余部分,其中有一个菜单按钮,带有触发toggleMenu()javascript函数的onclick操作

另外,我不想使用现成的jQuery插件或其他解决方案


有什么建议吗?

在css中使用以下内容解决:

而不是在css#菜单选择器中使用以下选项

overflow: hidden;
用这个代替

overflow-y: scroll;
overflow-x: hidden;
-webkit-overflow-scrolling: touch;
overflow-y: scroll;
overflow-x: hidden;
-webkit-overflow-scrolling: touch;