Posted in Javascript onAugust 25, 2013
点击弹出层外区域关闭弹出层jquery特效,废话不说,上代码,简洁明了:
<html> <head> <style> .hide{display:none;} .con{width:500px;height:300px;background:#000;} </style> <title>点击弹出层 ,点击弹出层外区域关闭弹出层jquery特效</title> <script type="text/javascript" src="http://jt.875.cn/js/jquery.js"></script> <script type="text/javascript"> $(document).ready(function() { $("div.down").click(function(e) { e.stopPropagation(); $("div.con").removeClass("hide"); }); $("div.con a").click(function() { $("div.con").addClass("hide"); }); $(document).click(function() { if (!$("div.con").hasClass("hide")) { $("div.con").addClass("hide"); } }); $("div.con").click(function (e) { e.stopPropagation();//阻止事件向上冒泡 }); }); </script> </head> <body> <div class="down">click</div> <div class="con hide">show-area <a style="color:#fff;">关闭</a> </div> </body> </html>
点击弹出层外区域关闭弹出层jquery特效示例
声明:登载此文出于传递更多信息之目的,并不意味着赞同其观点或证实其描述。
Reply on: @reply_date@
@reply_contents@