Я пытаюсь открыть раскрывающееся меню, когда я навешиваю над родительской ссылкой, и это работает, за исключением того, что когда на странице есть видео, оно, похоже, не работает ... Я не уверен Зачем. Я пробовал играть с z-индексами, но ничего не работает. Элементы подменю просто видят и мигают, но все меню не остается открытым ... Ниже приведен код jquery, CSS, а затем разметка html ... Не уверен, что я делаю неправильно. .Видео вмешивается в выпадающее меню?
var timeout = 500;
var closetimer = 0;
var ddmenuitem = 0;
function plinks_open()
{ plinks_canceltimer();
plinks_close();
ddmenuitem = $j(this).find('ul').css('visibility', 'visible');}
function plinks_close()
{ if(ddmenuitem) ddmenuitem.css('visibility', 'hidden');}
function plinks_timer()
{ closetimer = window.setTimeout(plinks_close, timeout);}
function plinks_canceltimer()
{ if(closetimer)
{ window.clearTimeout(closetimer);
closetimer = null;}
}
$j('document').ready(function()
{
$j('#plinks > li').bind('mouseover', plinks_open)
$j('#plinks > li').bind('mouseout', plinks_timer)
});
Вот CSS:
#plinks
{ margin: 0;
padding: 0
background: #fff;
}
#plinks li
{ float: left;
list-style: none;
background: #fff;
}
#plinks li a
{ display: block;
background: #fff;
text-decoration: none;
white-space: nowrap
}
#plinks li a:hover
{ background: #fff}
#plinks li ul
{ margin: 0;
padding: 0;
text-transform:lowercase;
position: absolute;
visibility: hidden;
background: #fff;
width: 400px;
text-align:left;
font-size: 14px;
z-index: 9999;
}
#plinks li ul li
{ float: none;
display: inline;
text-indent:5px;
}
#plinks li ul li a:hover
{ background: #fff }
Вот HTML разметка:
<div id="primary-links">
<ul id="plinks">
<li><a href="/blog">home</a></li>
<li><a href="/">portfolio</a></li>
<li><a href="/blog/?page_id=2">about</a></li>
<li><a href="/blog/?page_id=215">license</a></li>
<li><a href="/blog/?page_id=217">links</a></li>
<li><a href="/blog/categories.php">categories</a>
<ul style="height:200px; display: block; background-color: #fff">
<li>Sublink 1</li>
<li>Sublink 2</li>
<li>Sublink 3</li>
</ul>
</li>
<li><a href="/blog/?page_id=356">archives</a></li>
<li class="last"><a href="/blog/?page_id=219">connect</a></li>
</ul>
</div><!-- /primary-links -->
Думаю, вам нужно будет использовать IFrame. – TheVillageIdiot
thevillageidiot, вероятно, прав. то же самое происходит с элементами управления select, которые обсуждаются здесь: http://stackoverflow.com/questions/552326/ie-6-select-controlscombo-box-over-menu –