您的位置:首页 > Web前端 > JQuery

jquery扩展,显示模态DIV层 (二)

2015-10-28 16:50 591 查看
下面是示例文件 demo.html 代码:

<!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>
<title>遮罩层</title>
<meta http-equiv="Content-Type" content="text/html; charset=gbk" />
<meta name="Designer" content="cssrain" />
<meta name="Designer mail" content="cssrain@gmail.com" />
<meta name="Keywords" content="遮罩层" />
<meta name="Description" content="遮罩层" />
<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript" src="jquery.divbox.js"></script>
<style>
#divSCA
{
position: absolute;
width: 700px;
height: 500px;
font-size: 12px;
background: #fff;
border: 0px solid #000;
z-index: 10001;
display: none;
}
</style>
</head>
<body>
<input type="button" id="ttt" value="test" />
<div id="divSCA">
请选择信息类别<hr />
<input id="chkSelect" type="checkbox" />全选
<hr />
<div style="height: 132px; width: 500px; overflow: scroll;">
</div>
<div>
<input id="btnConfirmSCA" type="button" value="确定" />
<input id="btnCancelSCA" type="button" value="取消" />
</div>
</div>
<script type="text/javascript">
$(document).ready(function()
{
$("#ttt").click(function() { $('#divSCA').OpenDiv(); });
$("#btnConfirmSCA").click(function() { $("#divSCA").CloseDiv(); });
$("#btnCancelSCA").click(function() { $("#divSCA").CloseDiv(); });
});
</script>
</body>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: