如图:
左边是一个菜单导航条,右边是整块文章的内容(在写blog,文章内容是主要内容,左边菜单是弹出框)
在左边滚动条滚到底部时,继续滚动,整个页面的滚动条也会滚动。
如何滚动左边div块时,不影响整个页面的滚动条
谢谢~
如图:
左边是一个菜单导航条,右边是整块文章的内容(在写blog,文章内容是主要内容,左边菜单是弹出框)
在左边滚动条滚到底部时,继续滚动,整个页面的滚动条也会滚动。
如何滚动左边div块时,不影响整个页面的滚动条
谢谢~
$("#div").on('mousewheel', function(){//我这没有做兼容firefox,你可以看下mousewheel
var _self = $(this),
delta = (event.wheelDelta) ? event.wheelDelta / 120 : -(event.detail || 0) / 3;
if(delta > 0 && _self.scrollTop() === 0){//滑动到顶部,再往上滑就
e.preventDefault();
//滑动到底部,再往下滑就阻止默认行为
}else if(delta < 0 && (_self.scrollTop() == _self.get(0).scrollHeight - _self.height())){
e.preventDefault();
}
});
mousewheel的兼容 http://www.zhangxinxu.com/wor...
思路差不多就这样,用纯CSS只能说在滑动的过程中,不会触发浏览器整体的滚动条,但是滑到顶和底是办不到的,还是要借js才能完成。
10 回答11.7k 阅读
2 回答3.2k 阅读✓ 已解决
5 回答2.2k 阅读
3 回答1.6k 阅读✓ 已解决
3 回答2.7k 阅读✓ 已解决
5 回答743 阅读
4 回答2.2k 阅读✓ 已解决
左边容器设置高度
height: 100%
,然后在设置overflow-y: scroll
。