当前位置: 代码迷 >> Web前端 >> jquery好玩的货色
  详细解决方案

jquery好玩的货色

热度:84   发布时间:2012-11-09 10:18:47.0
jquery好玩的东西

搞后台弹出层,用jquery,实现的效果,发现 一个好玩的东西:

<script language="javascript">
var x = 10;
var y = 20;
$(function (){
$(".divpop").mouseover(function(e){
		var keywords=$(this).attr('foc');
		$(this).parent().css('background','#94D0EE');
		var  tooltip="<div id='tooltip'>关键字:"+keywords+"<\/div>"; //创建 div 元素
		$("body").append(tooltip);	//把它追加到文档中
		$("#tooltip")
			.css({
				"top": (e.pageY+y) + "px",
				"left":  (e.pageX+x)  + "px"
			}).show("fast");	  //设置x坐标和y坐标,并且显示
}).mouseout(function(){
		$(this).parent().css('background','#fff');
		$("#tooltip").remove();	 //移除 
    }).mousemove(function(e){
		$("#tooltip")
			.css({
				"top": (e.pageY+y) + "px",
				"left":  (e.pageX+x)  + "px"
			});
	});
	$(".divpop").siblings("td").mouseover(function(){
		$(this).parent().css('background','#94D0EE');
	}).mouseout(function(){
		$(this).parent().css('background','#fff');
	})
});
</script>

?$(".divpop").siblings("td").mouseover(function(){
$(this).parent().css('background','#94D0EE');
}).mouseout(function(){
$(this).parent().css('background','#fff');
})
$(this)代表鼠标移上去或者移出去的那个td,可以得出结论,可以通过元素事件,就不用直接遍历元素了

本来也可以这样:

?$(".divpop").siblings("td").each(function(){
??$(this).mouseover(function(){$(this).parent().css('background','#94D0EE')}).mouseout(function(){
??$(this).parent().css('background','#fff');
?})
?})

?

效果如下:



?

  相关解决方案