Jquery 对话框出现时如何禁用背景
当显示我的对话框时,ia如何禁用背景并使其模糊 addClass(“blur”)对相同的内容没有影响。warapper是包含除对话框代码之外的全部代码的divJquery 对话框出现时如何禁用背景,jquery,html,css,Jquery,Html,Css,当显示我的对话框时,ia如何禁用背景并使其模糊 addClass(“blur”)对相同的内容没有影响。warapper是包含除对话框代码之外的全部代码的div <div id="dialog-box" class="dialog-box"> <form id="dialog-box1" class="login_form"> <a href="#" id="close" class="close" style="float:right;margin
<div id="dialog-box" class="dialog-box">
<form id="dialog-box1" class="login_form">
<a href="#" id="close" class="close" style="float:right;margin:8px;margin-top:0px;color:white;text-decoration:none">x</a>
<h1 style="color:white">Log in</h1>
<div class="inset">
<p>
<label class="label" for="email">EMAIL ADDRESS</label>
<input class="input" type="text" name="email" id="email">
</p>
<p>
<label class="label" for="password">PASSWORD</label>
<input class="input" type="password" name="password" id="password">
</p>
<p>
<input class="input" type="checkbox" name="remember" id="remember">
<label class="label" for="remember">Remember me</label>
<a href="" ><img class="login_with" src="images/fb.png"></a>
<a href="" ><img class="login_with" id="gp" src="images/gp.png"></a>
</p>
</div>
<p class="p-container">
<span>Forgot password ?</span>
<input class="input" type="submit" name="go" id="go" value="Log in">
</p>
<a href="" style="float:right"><img src="images/fb.png"></a> <a href="" style="float:right"><img src="images/fb.png"></a>
<p>
</p>
<script type="text/javascript">
$(document).ready(function() {
$('#dialog-box').hide();
$('#login_button').click(function() {
$("#dialog-box").addClass('blur');
$('#dialog-box').show();
});
$('#close').click(function() {
$('#dialog-box').hide();
$('.wrapper').removeClass('blur');
});
})
</form>
</div>
登录
电子邮件地址
密码
记得我吗
忘记密码了?
$(文档).ready(函数(){
$(“#对话框”).hide();
$(“#登录按钮”)。单击(函数(){
$(“#对话框”).addClass('blur');
$(“#对话框”).show();
});
$(“#关闭”)。单击(函数(){
$(“#对话框”).hide();
$('.wrapper').removeClass('blur');
});
})
您可以使用下面的jquery创建一个模型弹出窗口:
function ShowDialog(divID, width, height) {
$("#" + divID).dialog({
autoOpen: true,
height: height,
width: width,
show: "fade",
hide: "fade",
modal: true
});
}
您必须通过DIV的高度、宽度和标题才能显示。属性modal:true
使其他空间不可读取