Здравствуйте уважаемые знатоки! Нужна помощь!
Задача в следующем:
При наведений мыши на вторую ссылку отображается ее содержимое из UL
Изначально первая ссылка и содержимое из UL(первого) отображены!
У меня есть пример, но он работает не правильно. Jquery не знаю
Может, сможете помочь?!
все стили не привожу в примере
Css:
.box {display: none;}
.box.visible {display: block;}
li.current {
color: #fff;
background: #000;
}
HTML:
<div class="vertical">
<ul class="tabs">
<li class="current">Первая ссылка</li>
<ul class="box visible"">
<li>Пример</li>
</ul>
<li>Вторая ссылка</li>
<ul class="box">
<li>Пример 2</li>
</ul>
</ul>
</div>
JQuery
(function($) {
$(function() {
$('ul.tabs').delegate('li:not(.current)', 'mouseover', function() {
$(this).addClass('current').siblings().removeClass('current')
.parent('ul').find('ul.box').hide().eq($(this).index()).fadeIn("slow");
})
})
})(jQuery)
И структура HTML важна, единственно могу div поставить пред UL class="box"
