网页弹出一个div层 后面出现一个半透明遮罩层 这是怎么实现的

2024-12-14 18:35:38
推荐回答(3个)
回答1:

var p=document.createElement("DIV");
p.id="MyAlertBoxMasker";
p.style.position="absolute";
p.style.width=document.body.scrollWidth;
p.style.height=document.documentElement.offsetHeight;
p.style.zIndex='998';
p.style.top='0';
p.style.left='0';
p.style.backgroundColor="gray";
p.style.opacity='0.5';
p.style.filter="alpha(opacity=80)";
//内容层
var p1=document.createElement("DIV");
var top=parseInt(parseInt(document.body.scrollHeight)*0.25)+document.body.scrollTop;
p1.id="MyAlertBox";
p1.style.position="absolute";
var left=document.documentElement.offsetHeight/2;
var left=0;
p1.style.zIndex='999';
p1.style.top=top+'px';
p1.style.left=left+'px';

p1.innerHTML="";//这里是浮动层的具体HTML内容
document.body.appendChild(p);
document.body.appendChild(p1);
//上面就是出现的代码。-----------

//下面代码是关闭的
document.body.removeChild(document.getElementById('MyAlertBoxMasker'));
document.body.removeChild(document.getElementById('MyAlertBox'));

回答2:

在浏览器的固定位置显示,你可以读取网页中一个固定元素的坐标,然后设置这个层和该元素的相对位置。

回答3:

你查下jq或者extjs
现在都是拿这2个js类库做
都很好学