我有一个位置:在滚动网页上修复div.
起初事件有效,但当页面滚动时,当固定的div保持原位时,其"触摸"区域似乎发生变化(它似乎在滚动 - 除了在另一个div的顶部,或者取决于页面布局...... ).如果滚动太多,最终不会再收到任何触摸事件.有时候底层的div会收到事件.
这是样本:
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=no;">
<meta name="apple-mobile-web-app-capable" content="yes" />
<style>
#fixed {
position: fixed;
width:200px;
height:200px;
z-index:1;
background: rgba(100,0,0,0.5);
}
#scrolling {
display: block;
position: absolute;
top: 100px;
left: 100px;
width:200px;
height:999px;
background: rgba(0,100,0,1);
}
</style>
</head>
<body>
<div id="fixed" ontouchend="alert('touch fixed')"></div>
<div id="scrolling" ontouchend="alert('touch scrolling')"></div>
</body>
Run Code Online (Sandbox Code Playgroud)
当您滚动足够并触摸左侧的红色"固定"div时,没有任何反应(没有警报).但是,在右侧(绿色滚动div上方)它可以工作......?!
看起来像Safari的bug.你经历过同样的经历吗?有任何解决方法吗?(Iscroll是不可能的 - 太慢了)
谢谢你,LC