您现在的位置： 万盛学电脑网 >> 程序编程 >> 网页制作 >> DivCSS教程 >> 正文
如何实现DIV遮罩层呢
作者：佚名 责任编辑：admin 更新时间：2022-06-22
欢迎大家在这里学习如何实现DIV遮罩层!这里是我们给大家整理出来的精彩内容。我相信，这些问题也肯定是很多朋友在关心的，所以我就给大家谈谈这个!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">
<html xmlns="">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>遮罩</title>
<style>
/*遮罩层*/
#tinybox_1 {
position:absolute;
width:1002px;
height:80px;
background:#FFF;
display: none;
z-index: 99999;
border:5px solid red;
display:none;
text-align:center;
padding:10px
}
#tinybox_1 h4{ display:block; margin:0 auto; width:1002px; line-height:40px}
.main{ width:98%; height:2000px; margin:0 auto; border:2px solid red; }
</style>
<!--遮罩 begin -->
<script type="text/javascript">
function BtHide(id){var Div = document.getElementById(id);if(Div){Div.style.display="none"}}
function BtShow(id){var Div = document.getElementById(id);if(Div){Div.style.display="block"}}
function BtPopload(showId){
// 高度减去 4px，避免在页面无滚动条时显示遮罩后出现流动条
var h = (Math.max(document.documentElement.scrollHeight,document.documentElement.clientHeight) - 4) + 'px';
var w = document.documentElement.scrollWidth + 'px';
var popCss = "background:#000;opacity:0.3;filter:alpha(opacity=30);position:absolute;left:0;top:0;overflow:hidden;border:0"//遮罩背景
var rePosition_mask = function() {
pop_Box.style.height = h;
pop_Box.style.width = w;
pop_Iframe.style.height = h;
pop_Iframe.style.width = w;
if (document.documentElement.offsetWidth < 950) {
//防止正常宽度下点击时 在 ff 下出现页面滚动到顶部
document.documentElement.style.overflowX = "hidden";
}
}
- 上一个程序编程： div+css是网页排版技巧介绍
- 下一个程序编程： 纯DIV+CSS实现圆角代码介绍
