如何div滚动时主页面不跟着滚动？
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了如何div滚动时主页面不跟着滚动？相关的知识，希望对你有一定的参考价值。
主页面某按钮点击后弹出DIV，主页面和弹出的DIV均有滚动条，如何在弹出的DIV上滚动条滚动时，主页面的滚动条不跟着一起滚动？
<html>
<head>
<style>
html,body height:3000px
#win display:none; position:absolute; left:100px; top:100px; width:500px; height:300px; overflow-y:scroll; border:1px solid #000
#content height:2000px;
</style>
<script>
window.onload=function()
var html=document.querySelector("html");
var body=document.querySelector("body");
openWin.onclick=function()
html.style.overflow="hidden";
body.style.overflow="hidden";
win.style.display="block";
return false;
closeWin.onclick=function()
html.style.overflow="visible";
body.style.overflow="visible";
win.style.display="none";
return false;
</script>
</head>
<body>
<a id="openWin" herf="#">打开DIV</a>
<div id="win">
<div id="content">
<a id="closeWin" herf="#">关闭DIV</a>
</div>
</div>
</body>
</html> 参考技术A 鼠标在div里 外面的 滚动条 是不会一起动的，除了div的后面没有内容了
如何在不隐藏正文滚动条的情况下在固定 div 上滚动时禁用正文滚动？
【中文标题】如何在不隐藏正文滚动条的情况下在固定 div 上滚动时禁用正文滚动？【英文标题】：How to disable scroll of body while scrolling on a fixed div without hiding scroll bar of body? 【发布时间】：2018-08-02 18:44:28 【问题描述】：当我在固定的 div 上滚动时，如何防止滚动正文。我试过overflow:hidden of body，它工作得很好，只是当滚动条被移除时页面在晃动。有没有办法保持滚动条并防止滚动？
【问题讨论】：
如果你能提供你的代码会很好（最好是带有 jsfiddle 或类似的链接）。 你有例子吗？ 【参考方案1】：js fiddle 用于具有 2 个 p 元素和一个 div 的简单主体。如您所见，如果您在 div 内滚动，则正文无论如何都不会滚动。无需将溢出设置为隐藏。只需确保 div 本身已将溢出-y 设置为滚动即可。 CSS 在下面的 div 上。 body 上不需要 css，也不需要 javascript
.theDiv
max-height: 300px;
overflow-y: scroll;
【讨论】：
【参考方案2】：我用这段代码解决了这个问题：
<script>
$(document).ready(function()
$(document).on('mousewheel',".dropdown-menu-rightt", function(e)
e.stopPropagation();
$(this).scrollTop($(this).scrollTop()-e.originalEvent.wheelDeltaY);
//prevent page fom scrollin
return false;
);
);
</script>
【讨论】：
以上是关于如何div滚动时主页面不跟着滚动？的主要内容，如果未能解决你的问题，请参考以下文章