$("#main .landkaart ul li > ul").hide();
$(".landkaart ul li").hover(function()
{
if($("ul",this).hasClass("open") )
{
$("ul", this).fadeOut().removeClass('open');
}
else
{
$("ul", this).fadeIn().addClass('open');
}
});
我有这个html结构:
<div class="landkaart">
<ul>
<li><a class="doetinchem" title="Vestiging Doetinchem" href="vestiging.html">Doetinchem</a>
<ul class="doetinchem">
<li><h2>Doetinchem</h2></li>
<li>Gildenbroederslaan 4</li>
<li>Postbus 196</li>
<li>7000 AD Doetinchem</li>
<li>Telefoon (0314) 37 70 00</li>
<li>Telefax (0314) 37 70 05</li>
<li>doetinchem@kabaccountants</li>
</ul>
</li>
<li><a class="didam" title="Vestiging Didam" href="vestiging.html">Didam</a>
<ul class="didam">
<li><h2>Didam</h2></li>
<li>Parallelweg 29</li>
<li>Postbus 50</li>
<li>6940 BB Didam</li>
<li>Telefoon (0316) 22 15 08</li>
<li>Telefax (0316) 22 78 30</li>
<li>didam@kabaccountants</li>
</ul>
</li>
</ul>
</div>
当我将鼠标悬停在li项目上时。 ul项目现在显示。但现在。我会自动这样做。如何在此功能上制作计时器?每5秒就有一个(“ul”,这个)项目
谢谢
答案 0 :(得分:1)
像这样:
示例: http://jsfiddle.net/eSk3X/1/
var $subUl = $(".landkaart ul li > ul").hide();
$subUl.eq(0).show();
var len = $subUl.length;
var index = 0;
setInterval(function() {
$subUl.eq( index ).removeClass('open').fadeOut(function() {
index = (++index % len);
$subUl.eq( index ).addClass('open').fadeIn();
}
);
}, 5000);