这里我的代码是:
<script src="http://code.jquery.com/jquery-1.6.1.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#pop").click(function(){
$("#overlay_form").fadeIn(1000);
positionPopup();
});
function positionPopup()
{
if(!$("#overlay_form").is(':visible')){
return;
}
$("#overlay_form").css({
left: ($(window).width() - $('#overlay_form').width()) / 2,
top: ($(window).width() - $('#overlay_form').width()) / 7,
position:'absolute'
});
}
$(window).bind('resize',positionPopup);
</script>
<style>
#overlay_form{position: absolute;border: 5px solid gray;padding: 10px;background: white; width: 380px;height: 120px;border-radius:20px;}
</style>
<div id="overlay_form" style="display:none;">
<p>hello</p>
</div>
我需要禁用后台点击事件。
答案 0 :(得分:1)
内部点击处理程序:
$("#pop").click(function(event){
event.stopPropagation();
event.preventDefault();
});
答案 1 :(得分:0)
$("#overlay_form").on("click", function(e) {
e.preventDefault();
e.stopPropagation();
});
答案 2 :(得分:0)
您可以通过在弹出窗口下方覆盖整个页面来完成此操作。在打开弹出窗口之前添加此代码。
$("body").append('<div class="modalOverlay">');
和css
.modalOverlay {
position: fixed;
width: 100%;
height: 100%;
top: 0px;
left: 0px;
background-color: rgba(0,0,0,0.3); /* black semi-transparent */
}
然后当您关闭弹出窗口时,只需从页面中删除此div。