Question

我尝试使用JSDDM下拉菜单和flot图创建一个页面。我遇到的问题是，当jsddm下拉菜单在图形画布上下降时，它变得透明。有没有办法强制jsddm下拉到总是在顶部和不透明？

<ul id="jsddm">
  <li><a href="#">JavaScript</a>
    <ul>
      <li><a href="#">Drop Down Menu</a></li>
      <li><a href="#">jQuery Plugin</a></li>
      <li class="b"><a href="#">Ajax Navigation</a>
        <ul>
          <li><a href="#">AJAXIFY</a></li>
        </ul>
      </li>
    </ul>
  </li>
  <li><a href="#">Effect</a>
    <ul>
      <li><a href="#">Slide Effect</a></li>
      <li><a href="#">Fade Effect</a></li>
      <li><a href="#">Opacity Mode</a></li>
      <li><a href="#">Drop Shadow</a></li>
      <li><a href="#">Semitransparent</a></li>
    </ul>
  </li>
  <li><a href="#">Navigation</a></li>
  <li><a href="#">HTML/CSS</a></li>
  <li><a href="#">Help</a></li>
  <br>
  <br>
  <div id="placeholder" style="width:600px;height:300px;"></div>
</ul>

jsfiddle

Answer 1

要确保下拉列表保持在内容之上，请更改CSS中的z-index值。背景颜色实际上是实心的，因为其他内容重叠的方式，它只是显得透明。

所以在你的情况下，这样的事情应该有效：

#jsddm ul {
    z-index: 1000;
}

jsddm显示在flot后面并变得透明

1 个答案: