当前的项目遇到了这个问题,
当打开dialog的时候,希望主页面的滚动条不要滚动。
一番搜索之后,发现大家的解决办法分为两种。
第一种
就是隐藏滚动条,但是这样的话,前台页面会因为滚动条的隐藏和出现而发生宽度的变化。
这就使得每次一打开dialog页面就会伸缩。十分难受。
第二种
就是不知道从哪儿抄的这种方法。
//禁止滚动条滚动
function unScroll() {
var top = $(document).scrollTop();
$(document).on('scroll.unable',function (e) {
$(document).scrollTop(top);
})
}
//移除禁止滚动条滚动
function removeUnScroll() {
$(document).unbind("scroll.unable");
}
一番修改之后,我也没好用。
最后 终于在外网找到个完美解决方案。
var winX = null;
var winY = null;
window.addEventListener('scroll', function () {
if (winX !== null && winY !== null) {
window.scrollTo(winX, winY);
}
});
function disableWindowScroll() {
winX = window.scrollX;
winY = window.scrollY;
}
function enableWindowScroll() {
winX = null;
winY = null;
}
根据需求自行修改。
*(在scrollTo方法中,最好加上behavior:'instant'属性。)
例:
window.scrollTo({top:winY,behavior:'instant'});
就可以完美解决js 禁用滚动条的问题啦。