Javascript safari(ios)上的侧菜单滚动滞后
我有一个移动网站,它有一个简单的侧菜单栏和滚动,当在safari上滚动菜单时,它会滞后很多(难以滚动) 以下是html: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>
<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;