今天搞了半天终于搞定了一个想要的js效果。在网上找也找不到相关资料。
可以节约页面显示空间。

使用了jquery的鼠标事件: jquery,mouseleave,hover.

另外在鼠标离开时隐藏可以使用 clearTimeout,setTimeout

功能鼠标经过隐藏,离开元素会自动停留在最终离开的区块。

不废话了代码如下:

View Code JAVASCRIPT
$(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');
	});
});

效果图如下,希望能对大家有用。

出处: 马丁博客http://www.blags.org/

本文链接地址: http://www.blags.org/jquery-after-in-the-event-the-mouse/

原创文章,转载请注明出处,否则视为侵权。