今天搞了半天终于搞定了一个想要的js效果。在网上找也找不到相关资料。
可以节约页面显示空间。
使用了jquery的鼠标事件: jquery,mouseleave,hover.
另外在鼠标离开时隐藏可以使用 clearTimeout，setTimeout
功能鼠标经过隐藏，离开元素会自动停留在最终离开的区块。
不废话了代码如下:
$(document).ready(function(){
$(".newsright ul li").hover(function(){
$(".newsright ul li").addClass('hide');
$(this).removeClass('hide').addClass('show');
}).mouseleave(function(){
var i = 0;
$('.newsright ul li').each(function()
{
if($(this).hasClass('show')){i++;}
});
if(!i)$(this).addClass('hide').removeClass('show');
});
});
效果图如下,希望能对大家有用。
