我正在使用scrollTo jQuery插件,想知道是否有可能通过Javascript暂时禁用窗口元素上的滚动?我想禁用滚动的原因是,当你滚动而scrollTo是动画,它变得非常难看;)
当然,我可以做$("body").css("overflow", "hidden");然后当动画停止时把它放回自动,但如果滚动条仍然可见但不活跃会更好。
我正在使用scrollTo jQuery插件,想知道是否有可能通过Javascript暂时禁用窗口元素上的滚动?我想禁用滚动的原因是,当你滚动而scrollTo是动画,它变得非常难看;)
当然,我可以做$("body").css("overflow", "hidden");然后当动画停止时把它放回自动,但如果滚动条仍然可见但不活跃会更好。
当前回答
this.style.overflowX = 'hidden'; 您可以在函数中使用此代码行,并在被单击的特定元素上工作。
其他回答
您可以阻止空格条滚动和隐藏浏览器滚动条:
$(document).keydown(function(event) {
if (event.keyCode == 32) {
return false;
}
});
document.documentElement.style.overflow = 'hidden';
document.body.scroll = 'no';
最简单的方法是:
$("body").css("overflow", "hidden"); // Remove the scroll bar temporarily
要撤消它:
$("body").css("overflow", "auto");
很容易实现,但唯一的缺点是:
如果页面是居中对齐的(水平),它会向左跳一点。
这是由于滚动条被移除,并且视口变得更宽。
this.style.overflowX = 'hidden'; 您可以在函数中使用此代码行,并在被单击的特定元素上工作。
根据galambalazs的帖子,我将添加对触摸设备的支持,允许我们触摸但不能上下滚动:
function disable_scroll() {
...
document.ontouchmove = function(e){
e.preventDefault();
}
}
function enable_scroll() {
...
document.ontouchmove = function(e){
return true;
}
}
这个怎么样?(如果你正在使用jQuery)
var $window = $(window);
var $body = $(window.document.body);
window.onscroll = function() {
var overlay = $body.children(".ui-widget-overlay").first();
// Check if the overlay is visible and restore the previous scroll state
if (overlay.is(":visible")) {
var scrollPos = $body.data("scroll-pos") || { x: 0, y: 0 };
window.scrollTo(scrollPos.x, scrollPos.y);
}
else {
// Just store the scroll state
$body.data("scroll-pos", { x: $window.scrollLeft(), y: $window.scrollTop() });
}
};