Question

有一个问题。我试图为我的目标网页添加一个小部件（包含在div中）。现在，基本上我想要做的就是当我点击按钮时触发OverLayTwo但是它落到了背景而不是前景。我尝试了z-index方法，它似乎没有帮助。

    <div class="OverLay">

     <div class="widgetContainer">
      <li>This is a Div</li>
       First Name: <input type="text" name="fname"></input>
     </div>

     <div class="OverLayTwo">

     </div>

      <button class="randomButton">Hello</button>

    </div>

基本上我想要的是当用户点击按钮时，要使用OverLayTwo＆＃39;然而，它落在＆＃34; widgetContainer＆＃34;背后的背景/背景中。 DIV。 -

原因是我希望用户能够输入输入字段，但是，最近我查看或引用的所有内容都没有解决问题。基本上只是将叠加层放在窗口小部件的顶部/前面 - 不允许用户在适当的输入字段中输入文本。

希望有道理。 CSS的土地是一个真正的迷宫o.o ...另外，应该注意我使用的是javascript和jQuery功能。

任何提示和/或建议都会非常感激！

谢谢！

Answer 1

当它生活在第一个叠加内部时，很难让它落在后台......试试这样的东西..

<div class="OverLay" style="z-index:100">
 <div class="widgetContainer">
  <li>This is a Div</li>
   First Name: <input type="text" name="fname"></input>
 </div>
  <button class="randomButton">Hello</button>
</div>

<div class="OverLayTwo"  style="z-index:90">
 </div>

覆盖与输入字段的冲突

1 个答案: