当模态打开时防止背景滚动（NOT BOOTSTRAP）

Question

我已经从头创建了自己的模态，我想在模式打开时阻止在后台滚动，我在网上找到的所有内容都是关于bootstrap的东西，这对我没用，因为我的代码不会自动调用'模态开放'所以

body.modal-open{ overflow:hidden; }

对我不起作用。

    <div id="wrapper3">
    <a class="button" href="#openModal-4">
    <img  class="image"src="img/Animation.png">
            <p class="text">Animation</p>

        </a>
        </div>
        <div id="openModal-4" class="modalbg">
          <div class="dialog">
            <a href="#close" title="Close" class="close">X</a>
                <div class="popout">
                        <h1>2D Animation Project</h1>
                        <div>
                        <h2>Project Brief</h2>

                        <a class="modalfullimg"><img src="img/Design/moodboard.png"></a>
                        </div>
                        <h2>Sketches</h2>
                        <a class="modalfullimg"><img src="img/Design/initialsketches.png"></a>


                </div>

            </div>
        </div>

Answer 1

您是否可以修改您编写的脚本以添加类似'modal-open'的正文类，以便您可以应用适当的CSS？似乎是最简单的解决方案，如果你正在进行自定义。