2
хорошо выложил на ранней стадии и сделал полный хэш из него Извините! У меня теперь есть своя скрипка, проблема в том, что я использую noJS для анимации моих меню, но, получив меню, смотря, как я хотел, noJS перестала работать, поэтому я играл с css, и теперь меню don «т работать должным образом на всех, вот моя скрипка Menu behaving badlyМеню плохо себя ведет
HTML:
<div id="header-container">
<div id="bandmenu-container">
<ul id="bandmenu">
<li><a href="#">Band</a> <!-- first level -->
<ul class="noJS"> <!-- second level -->
<li><a href="#">History</a></li>
<li class="divider"></li>
<li><a href="#">Members</a>
<ul class="noJS"> <!-- thered level -->
<li><a href="#">Paul Hughes</a></li>
<li class="divider"></li>
<li><a href="#">David Grant</a></li>
<li class="divider"></li>
<li><a href="#">Tony Duggins</a></li>
<li class="divider"></li>
<li><a href="#">David Lee-Channing</a></li>
<li class="divider"></li>
<li><a href="#">Thomas Casson</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="#">Media</a>
<ul class="noJS">
<li><a href="#">The Gallery</a></li>
<li class="divider"></li>
<li><a href="#">Videos</a></li>
<li class="divider"></li>
<li><a href="#">Music</a></li>
</ul>
</li>
<li><a href="#">Bookings</a>
<ul class="noJS">
<li><a href="#">Enquires</a></li>
<li class="divider"></li>
<li><a href="#">Current Bookings</a></li>
</ul>
</li>
<li><a href="#">FAQ's</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>
CSS:
#header-container {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 164px;
}
/* Band Menu
---------------------------------------------*/
#bandmenu-container {
position: relative; /* IE7 */
top: 135px;
width: 500px;
height: 29px;
margin: 0 auto;
}
/* Main Menu
---------------------------------------------*/
#bandmenu, #bandmenu ul {
padding: 0;
margin: 0;
list-style: none;
line-height: 1.5em;
white-space: nowrap;
z-index: 999;
}
#bandmenu li {
position: relative; /* IE7 */
vertical-align: bottom; /* IE7 */
/* next two lines: bar height*/
padding-top: 2px;
height: 26px;
float: left;
}
#bandmenu a {
color: #fff;
padding: 0px 16px;
text-decoration: none;
}
#bandmenu li ul {
position: absolute;
background: #c2c2c2;
left: -999em;
}
#bandmenu ul li {
float: none;
}
#bandmenu li li {
clear: both;
width: auto;
background-color: #660000;
}
#bandmenu ul li a {
width: 60px;
color: #fff;
padding: 5 !important;
line-height: 1.5em;
}
#bandmenu li li a {
margin: 0;
}
#bandmenu > li:hover > a { /* highlight all menus */
display: block;
width: auto;
background-color: #c2c2c2;
color: #fff;
}
#bandmenu li:hover ul.noJS { /* show first nested level */
display: block;
width: auto;
height: auto;
left: 30px;
top: 24px;
border: 2px #fff solid;
font-size: small;
}
#bandmenu li li:hover ul { /* show second nested level */
display: block;
left: 100%;
top: 0;
font-size: small;
}
#bandmenu .divider {
padding-top: 1px;
height: 1px;
width: auto;
overflow: hidden;
background: url('../images/divider.gif')
}
Вы должны сказать, что проблема вы столкнулись с более четко. «меню не работают должным образом», не говорит, с какими проблемами вы сталкиваетесь. –
Как это плохо себя ведет? Я предполагаю, что при зависании вы хотите, чтобы прямое подменю отображалось, а не ВСЕ подменю? –
Правильно Кенни, но, используя отредактированный код из Xahed, я вообще не вижу подменю. – Dave