JQuery弹出炫丽对话框的同时让背景变灰色

前端技术 2023/09/09 JavaScript
这段时间在做开发时，用到了JQuery弹出炫丽对话框，背景变灰色。特地和大家分享分享。

先看效果图：
 
代码如下：
复制代码 代码如下:

<html xmlns=\"http://www.w3.org/1999/xhtml\">
<head>
<meta http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\" />
<script src=\"js/jquery-1.9.1.js\"></script>
<script src=\"js/jquery-ui.js\"></script>
<link rel=\"stylesheet\" type=\"text/css\" href=\"css/jquery-ui.css\">
<title>JQuery弹出框，背景变灰色</title>
<script type=\"text/javascript\">
$(document).ready(function(e) {
$( \"#reviews\" ).bind(\'click\',function(event) {
$( \"#checkandPass\" ).dialog({
autoOpen: true,
width: 765 ,
show: \"blind\",
hide: \"explode\",
modal: true,//设置背景灰的
});
$( \"#checkandPass\" ).dialog( \"open\" );
return true;
});
});
</script>
</head>

<body>
<div>
<input type=\"button\"id=\"reviews\"value=\"Click me\"/>
</div>
<div id=\"checkandPass\" title=\"审核意见\" style=\"display: none;\">
<form id=\"passideas_true\" method=\"post\" enctype=\"multipart/form-data\" >
<div>
<textarea style=\"width:100%;height:90%;min-height: 100px;\"></textarea>
</div>
<div style=\"margin-top: 20px;text-align: center;\">
<button style=\"height:30px;width:80px;\" type=\"button\" id=\"upfpass_true\" >确定</button>
<button style=\"height:30px;width:80px;\" id=\"sb\">取消</button>
</div>
</form>
</div>
</body>
</html>

保证是你要的效果。

本文地址：https://www.stayed.cn/item/23645

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见，何事秋风悲画扇。

我的标签

随笔档案