Javascript 隐藏滚动条而不影响页面宽度或不稳定的页面重新呈现

我有一个位置固定的div（我的对话框），当执行某个操作时，我给它一个更高的z索引来接管我的页面。我试图通过执行

overflow:hidden来隐藏我的滚动条不影响页面宽度。有没有关于如何执行的建议

html, body {
background: #FFFFFF;
font-family: "Avenir Medium";
height: 100%;
transition: overflow 0.37s easein-out
}

.div-dialog{
display: none;
opacity: 0;
position: fixed;
width: 0;
left: 0;
top: 0;
z-index: 0;
overflow: hidden;
background: white;
-webkit-transition: opacity 0.30s ease-in-out;
transition: opacity 0.30s easein-out;
}

尝试复制我的结果。我试图实现的实现是，当您单击左上角的搜索图标时，通过执行以下操作，终于能够解决我的问题

    html,body{
     height: 100%;
     overflow: hidden;
    }
    body{
     overflow: auto;
    }

通过这样做，我的所有内容都会留在主体中，因此当元素的位置固定时，它会覆盖滚动条，并且不会受到其溢出的任何更改的影响，
overflow:hidden或overflow:auto
如果您解释了为什么要完成此任务，并在或上提供了一个示例，可能会有所帮助。您可以展示一个真实的示例吗？要隐藏哪个滚动条？正常内容中的条形图或叠加div导致的条形图？请选中此复选框，以便提问/回答。也许这对你有用…这是一个即时消息我的情况浏览器宽度随着我隐藏而增加，随着我显示滚动条而缩小。还有一个fadein动画，使其更加可见