用javascript改变z-index

Question

我正在使用php建立一个网站

我像这样做左菜单

这些菜单来自数据库中的一个字符串。 我用echo打印它。 我使用图像作为每个菜单的背景。

现在我想要这样

我有一张箭头图片。

我知道我可以用z-index做到这一点。但我不能只用css做到这一点。 所以我需要帮助来用javascript做到这一点。 我想用javascript或jquery

更改html

Answer 1

对于所有CSS解决方案，尝试像这样构建菜单......

<style type="text/css">
  .menu li {
    background:url(path/to/gradient.png) top left repeat-x;
  }
  .menu li a {
    display:block;
    padding:2px 5px;
    backround:url(path/to/arrow.png) bottom right no-repeat;
  }
</style>


<ul class="menu">
  <li><a href="fanclub.php">Fan Club</a></li>
  <li><a href="blog.php">Blog</a></li>
  <li><a href="poll.php">Poll</a></li>
</ul>

如果您必须使用JavaScript（我建议您避免使用）解决方案，您可以访问任何元素（支持它）的z-index属性，如下所示：

// DOM Scripting Example (Single Element)
myElement.style.zIndex = 1000;

// jQuery Example (All elements with the "arrow" class)
$('.arrow').css('z-index', 1000);

Answer 2

使用jquery：

$(function() {
    $('.myselectorclass').css('z-index','1000');
});

将'1000'替换为您想要的z-index值，当然