前端效果:
鼠标滑上div的时候,隐藏当前显示的div,显示另一个div,离开的话还原,使用slideUp()和slideDown()即可解决。
需要注意的是,设置延迟的话,离开的时候当前div的时候未到达延迟时间,会导致离开之后div执行了事件,因此需要清除。
<ul id="marketAppDiv">
<s:iterator value="allList" status="st" var="app">
<li>
<div class="info">
<span><img src=""/></span><br/>
<span>${app.name}</span>
</div>
<div class="subinfo">
<span>提供商:${prov}</span><br/>
<span>发布日期:${devTime}</span>
</div>
</li>
</s:iterator>
<ul>
jQuery("#marketAppDiv").children('li').hover( function() { var me = this; this._timeout = setTimeout(function() { jQuery(me).children('div.subinfo').slideUp(300); }, 500); }, function() { var me = this; clearTimeout(this._timeout); jQuery(me).children('div.subinfo').slideDown(100); });