转载

jQuery: 仿select下拉框效果,点击空白关闭弹出层,判断是否被mouseover

1. 方法一

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> <script src="http://www.w3cschool.cn/jquery.js" type="text/javascript"></script> <script type="text/javascript"> $(function(){  $(".btn").click(function(e){   e.stopPropagation();   $("#box").show();    });  $("#box").click(function(e){   e.stopPropagation();    });  document.onclick = function(){   $("#box").hide();  };  }) </script> <style> #box {width:300px;height:200px;border:1px solid #000;display:none} </style> </head>  <body> <div id="box"></div> <span class="btn">显示层</span> </body> </html>

2. 方法二

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> <script src="http://www.w3cschool.cn/jquery.js" type="text/javascript"></script> <script type="text/javascript"> $(function(){  $(".btn").click(function(){     $("#box").show();   return false;  });  $("#box").click(function(){   return false;  });  document.onclick = function(){   $("#box").hide();  };  }) </script> <style> #box {width:300px;height:200px;border:1px solid #000;display:none} </style> </head>  <body> <div id="box"></div> <span class="btn">显示层</span> </body> </html>

来源: http://bbs.blueidea.com/forum.php?mod=viewthread&tid=3056515&page=1#pid5427170

3. 判断元素是否被mouseover

$('#test').click(function() {     if ($('#hello').is(':hover')) {         alert('hello');     } });

或者

if ($('#element:hover').length != 0) {     // do something ;) }

来源: http://stackoverflow.com/questions/1273566/how-do-i-check-if-the-mouse-is-over-an-element-in-jquery

 justcode.ikeepstudying.com

正文到此结束
Loading...