Javascript 模式使整个屏幕变暗，没有任何内容可点击

我使用的是引导模式，这是我的布局

用户将位于站点上有标题的任何位置，标题中有一个“设置”按钮，单击该按钮可以显示其中包含一些选项的模式。这些选项与问题无关

The button to activate the modal is in a header file called topbar.php.
The modal is coded in a modals file called modals.php
modals.php is include()'d (via php) in the topbar.php file.

我让它工作了，除了一个主要的缺陷。当模式出现时，它会使整个屏幕变暗（包括模式上方），从而使所有内容都不可读取

topbar.php：

<ul class="nav navbar-right top-nav">
    <li class="dropdown">
        <a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-user"></i> <? echo $_SESSION['Name']; ?> <b class="caret"></b></a>
        <ul class="dropdown-menu">
            <li>
                <a data-toggle="modal" data-target="#selfUpdate" href="#" id="settingsModal"><i class="fa fa-fw fa-gear"></i> Settings</a>
            </li>
            <li class="divider"></li>
            <li>
                <a href="logout.php"><i class="fa fa-fw fa-power-off"></i> Log Out</a>
            </li>
        </ul>
    </li>
</ul>

<? include('./dynamic/modals.php'); ?>

modals.php：

<link rel="stylesheet" href="../css/bootstrap.min.css">
<script src="../js/anotherJQ.js"></script>
<script src="../js/bootstrap.min.js"></script>

    <!-- Modal -->
    <div class="modal fade" id="selfUpdate" tabindex="-1" role="dialog" aria-labelledby="selfUpdateLabel">
      <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            <h4 class="modal-title" id="selfUpdateLabel">Modal title</h4>
          </div>
          <div class="modal-body">
            ...
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button type="button" class="btn btn-primary">Save changes</button>
          </div>
        </div>
      </div>
    </div>

&时代；
情态标题
...
接近
保存更改

CSS是默认的引导

如果我碰巧从modals.php页面（通过在该文件中放置一个按钮）运行该模式，它将正常运行，但不会与我的网站设计一起工作。

---

有谁能帮我弄清楚为什么背景覆盖了整个页面（包括模式本身）？

事实证明，这是因为模式代码被放置在网站的页眉中，修复方法是只需将其移动到页脚，然后再加载其他内容。

事实证明，这是因为模式代码被放置在网站的页眉中，修复方法是简单地将其移动到页脚，然后再加载其他内容。

检查背景的

z-index

。检查背景的

z-index

。