菜单栏子菜单隐藏在javascript滑块下

时间:2011-10-28 13:37:25

标签: html css

* {
font-family:verdana;
font-size:12px;
line-height:16px;
margin:0 auto;
padding:0;
}

body {
background-color:#609fdf;
color:#4d4c4c;
padding:40px 0;
}

#main {
width:1085px;
}

#main_container {
background:url(img/background.png) repeat-y;
}

#content {
background:url(img/content.gif) repeat-x #c9cbcc;
min-height:470px;
margin:0 34px;
padding:20px;
}

#content_top {
background:url(img/background_top.png);
height:47px;
}

#content_bottom {
background:url(img/background_bottom.png);
height:40px;
}

.right {
float:right;
}

.left {
float:left;
}

.center {
text-align:center;
}

.clear {
clear:both;
}

.mar-t {
margin-top:10px;
}

.mar-b {
margin-bottom:10px;
}

#header {
margin-left:35px;
margin-bottom:21px;
}

#header_menu {
width:1015px;
text-align:center;
float:right;
position:relative;
right:32px;
top:-27px;
margin-right:2px;
}

#header_menu a {
color:#fff;
font-size:14px;
line-height:40px;
}

#header_menu ul {
float:right;
z-index:10;
}

#header_menu ul ul {
display:none;
border-left:1px solid #940e0f;
width:200px;
border:1px solid #940e0f;
position:absolute;
}

#header_menu li {
float:left;
background:url(http://edutube.in/word4/wp-content/uploads/2011/10/navbarLeft.png) left top no-repeat;
margin-left:5px;
}

#header_menu li a {
display:block;
background:url(http://edutube.in/word4/wp-content/uploads/2011/10/navbarRight.png) right top no-repeat;
margin-left:10px;
padding:0 15px 7px 4px;
}

#header_menu li.current_page_item {
background:url(http://edutube.in/word4/wp-content/uploads/2011/10/navbarLeft.png) no-repeat 0 -47px;
}

#header_menu li.current_page_item a {
background:url(http://edutube.in/word4/wp-content/uploads/2011/10/navbarRight.png) no-repeat right -47px;
}

#header_menu li:hover ul {
display:block;
}

#header_menu li:hover ul ul {
display:none;
}

#header_menu li:hover {
position:relative;
}

#header_menu li li {
float:none;
background:#fff;
text-align:left;
border-bottom:1px solid #940e0f;
position:relative;
margin:0;
padding:5px 5px 0 0;
}

#header_menu li li:last-child {
border-bottom:none;
}

现在我的问题是侧边栏我需要它在滑块上(我正在使用的nivoslider),这样侧面将位于滑块的顶部,滑块将像往常一样 我试过的z-index是不行的,所以解决这个问题的方法是什么 该网站的链接在下面

link

2 个答案:

答案 0 :(得分:0)

  • 将Flash影片换入z-index高于菜单
  • 的DIV
  • 在嵌入代码上设置参数wmode =“opaque”,这很可能就是问题

答案 1 :(得分:0)

在CSS中添加如下内容应该使滑块上的菜单列表:

#left
{
    position: relative;
    z-index: 10000;
}

要使z-index属性起作用,您需要在元素上使用position: relativeposition: absolute