做过Web开发的朋友曾经都有过这么个念头:在自己的页面里内嵌一个其他网站的网页,然后可以用脚本去获取他们页面里的信息,甚至可以。。。 显然,有这么好的事也肯定轮不到你来尝了:)一个叫沙箱模型的东西被发明出来,就是防止有这种想法的人搞破坏。。。所以现在的我们只能远观,不可亵玩也。 不过,这些规定只是针对脚本而已。假如让用户自己乖乖的去点,那当然是没问题的。但有多少人会去点呢!! 所以,我们需要施一些特殊的障眼法,让用户在不经意间,就点了我们想让他点的东西:) 就拿上面那个来说吧,如果直接把这个大页面赤果果的硬塞进网页,无论你怎么提示他点,或者说多少好话,大家见了就烦,就是不点:) 所以说,我们必须得修饰修饰,不然人家见了就吓跑了。首先也是最关键的就是这身材问题,突然冒出个这么肥硕的一个页面,看的人眼花缭乱,不知道 发送什么情况啦。我们要好好修剪一下,把没用的部分统统去掉,只留下我们想要的“精华”。这个简单,只要把框架先放到一个层里面,然后把层的尺寸固定好,…
May 18, 2015
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
更多参考:
jQuery : ddSlick 自定义select下拉框 custom drop down with images and description.
jQuery: textarea 自动适应高度 无下拉条 Elastic
本文: jQuery: 仿select下拉框效果,点击空白关闭弹出层,判断是否被mouseover
2 Comments