我有一个网站,我想在灯箱弹出时禁用所有滚动,然后在灯箱关闭时重新启用它。我有这个:
document.ontouchmove = function(e){
if (stopScroll) {
e.preventDefault();
}
}
这非常适合手动滚动,但用户仍然可以点击状态栏并进入页面顶部(现在灯箱不再居中,或者更糟糕的是,完全离开页面)。我正在使用 JQuery 移动。如何在 iOS 中暂时禁用此功能?
我有一个网站,我想在灯箱弹出时禁用所有滚动,然后在灯箱关闭时重新启用它。我有这个:
document.ontouchmove = function(e){
if (stopScroll) {
e.preventDefault();
}
}
这非常适合手动滚动,但用户仍然可以点击状态栏并进入页面顶部(现在灯箱不再居中,或者更糟糕的是,完全离开页面)。我正在使用 JQuery 移动。如何在 iOS 中暂时禁用此功能?
我不相信这是可能的。该问题的更好解决方案是通过将灯箱位置更改为固定而不是绝对位置来防止您的灯箱在发生滚动时损坏:
</style>
.centered {
position: fixed;
top: 50%;
left: 50%;
margin-top: -50px;
margin-left: -50px;
background:#ccc;
width:100px;
height:100px;
}
</style>
<div class="centered">I won't scroll off page</div>
另一种选择是检查滚动事件并恢复原始位置:
$('.show_popup').on('click', function(){
var position= $(window).scrollTop(); // save pos
// show popup
$(window).scroll(function(){
$(window).scrollTop(position); // restore pos on scroll
});
});
$('.hide_popup').on('click', function(){
$(window).off(); // remove handler
});
示例:jsFiddle