双11狂欢大促

盲盒赢 定制羽绒服

开启惊喜盲盒，抽取你的专属好礼

— 惊喜奖品抢先看 —

超级年卡50元券

周边70元券

手机支架

一拖三数据线

雨伞

运动毛巾

电动牙刷

VIP月卡

机械键盘

定制羽绒服

超级年卡50元券

周边70元券

手机支架

一拖三数据线

雨伞

运动毛巾

电动牙刷

VIP月卡

机械键盘

定制羽绒服

DIV层问题！

2009-05-07 06:25:25 396 阅读 AI 写同款 · GEO 优化AI 选题数据监测一键分发 ›

luyuans86 墨衍会员 · AI 创作全网分发关注 + 加入社区

jQuery实现鼠标悬浮在div上时候动态浮动另外一个div层盖住第一个div层无标题文档 .caption{ width:200px; height:100px; background-color:red; position:fixed; } .layer{ width:200px; background-color:blue; position:fixed; margin-top:100px;/*和div的高度一致*/ display:no 阅读详情

就是比如csdn上，提醒你结帖子的时候，弹出一个层，

然后整个页面被蒙上了一层纱，请问这种效果叫什么，或者说怎么实现

谢谢

...全文

YOLOv5 改进点总览：轻量化、高精度的背后有哪些魔改？ YOLOv5是由Ultralytics团队开发的高效目标检测模型，其核心改进包括：主干网络采用CSPDarknet53提升梯度传播效率；特征融合使用PANet增强小目标识别；输出结构采用解耦头设计优化定位和分类任务。此外，YOLOv5通过CIoU损失函数、Mosaic数据增强和SimOTA标签分配机制进一步提升性能。模型支持多种推理格式（ONNX/TensorRT等），并具备自动锚框匹配和多尺度训练功能，使其在轻量化（yolov5s仅7MB）与高性能（最高51.2% mAP）间取得平衡，但缺乏正式论文支撑是阅读详情

luyuans86

.NET社区 62,274 成员 668,968 内容

+ 关注 + 加入社区

切换为时间正序

luyuans86 2009-05-10

打赏
举报

谢谢各位，我领教了，我会好好学习的。我马上结贴

wc0730 2009-05-08

打赏
举报

貌似光遮不难的……就是要在遮罩上要画一个好看的界面出来这个得花点功夫

悔说话的哑巴 2009-05-08

打赏
举报

叫遮罩层，代码就不用贴了吧

k3109852 2009-05-08

打赏
举报



<input type="button" onclick="Report(800,600,800,600,'sample');return false;"/>

<!--参数说明，横纵坐标，长和宽，遮罩层的ID-->

<div id="sample" style="display:none; ">

<!--放置你要弹出的页面，可以用iframe实现-->

</div>



// JScript 文件



var t_DiglogX,t_DiglogY,t_DiglogW,t_DiglogH;



function gid(id) {

return document.getElementById?document.getElementById(id):null;

}





function Browser() {

var ua, s, i;

this.isIE = false;

this.isNS = false;

this.isOP = false;

this.isSF = false;

ua = navigator.userAgent.toLowerCase();

s = "opera";

if ((i = ua.indexOf(s)) >= 0) {

this.isOP = true;return;

}

s = "msie";

if ((i = ua.indexOf(s)) >= 0) {

this.isIE = true;return;

}

s = "netscape6/";

if ((i = ua.indexOf(s)) >= 0) {

this.isNS = true;return;

}

s = "gecko";

if ((i = ua.indexOf(s)) >= 0) {

this.isNS = true;return;

}

s = "safari";

if ((i = ua.indexOf(s)) >= 0) {

this.isSF = true;return;

}

}



function DialogLoc() {

var dde = document.documentElement;

if (window.innerWidth) {

var ww = window.innerWidth;

var wh = window.innerHeight;

var bgX = window.pageXOffset;

var bgY = window.pageYOffset;

} else {

var ww = dde.offsetWidth;

var wh = dde.offsetHeight;

var bgX = dde.scrollLeft;

var bgY = dde.scrollTop;

}

t_DiglogX = (bgX + ((ww - t_DiglogW)/2));

t_DiglogY = (bgY + ((wh - t_DiglogH)/2));

}



function DialogShow(showdata,ow,oh,w,h) {

var objDialog = document.getElementById("DialogMove");

if (!objDialog) objDialog = document.createElement("div");

t_DiglogW = ow;

t_DiglogH = oh;

DialogLoc();

objDialog.id = "DialogMove";

var oS = objDialog.style;

oS.display = "block";

oS.top = t_DiglogY + "px";

oS.left = t_DiglogX + "px";

oS.margin = "0px";

oS.padding = "0px";

oS.width = w + "px";

oS.height = h + "px";

oS.position = "absolute";

oS.zIndex = "5";

oS.background = "#FFF";

oS.border = "solid #DCEBFF 1px";

objDialog.innerHTML = showdata;

document.body.appendChild(objDialog);

}



function DialogHide() {

ScreenClean();

var objDialog = document.getElementById("DialogMove");

if (objDialog) objDialog.style.display = "none";

}



function ScreenConvert() {

var browser = new Browser();

var objScreen = gid("ScreenOver");

if (!objScreen) var objScreen = document.createElement("div");

var oS = objScreen.style;

objScreen.id = "ScreenOver";

oS.display = "block";

oS.top = oS.left = oS.margin = oS.padding = "0px";

//z-index

oS.width = "100%";

oS.height = "1400px";;

oS.position = "absolute";

oS.zIndex = "3";

if ((!browser.isSF) && (!browser.isOP)) {

oS.background = "#FDFDFD";

} else {

oS.background = "#F0F0F0";

}

oS.filter = "alpha(opacity=40)";

oS.opacity = 40/100;

oS.MozOpacity = 40/100;

document.body.appendChild(objScreen);

}



function ScreenClean() {

var objScreen = document.getElementById("ScreenOver");

if (objScreen) objScreen.style.display = "none";

}





function Report(width,height,width_align,height_align,div_id)

{

   //var PostData = "do=" + Type + "&reportid=" + ID;

   //PostRequest(window.location.protocol + "//" + window.location.host + "/AJAX_Comm.aspx", PostData);

   var showData = document.getElementById(div_id).innerHTML;

   //ScreenConvert();DialogShow("<div id=\"DialogLoading\">正在读取,请稍候...</div>",110,10,124,20);

   ScreenConvert();

   DialogShow(showData,width,height,width_align,height_align);



}

function display(){

ScreenClean();

DialogHide()

}

皓月明 2009-05-08

打赏
举报

javascript就可以实现

sayluyun 2009-05-08

打赏
举报

MARK```

littlehand 2009-05-08

打赏
举报

只是 javascript 动态控制dom而已,楼主可以学习下js方面的知识

中年秃头大叔 2009-05-08

打赏
举报

顶，楼主都给了，我就不发了...

新时代新目标新征程 2009-05-08

打赏
举报

实际是两个div，一个将整个页面盖住，一个在上面显示对话框

柳晛 2009-05-08

打赏
举报

[Quote=引用 11 楼 wc0730 的回复:]
貌似光遮不难的……就是要在遮罩上要画一个好看的界面出来这个得花点功夫
[/Quote]
那个窗口不是画的，就是调用了一个网页，类似于90年代的弹窗广告。
在Discuz论坛中，官方管这种效果叫“悬窗”，参考：http://www.discuz.net/thread-1144076-1-1.html

wapit 2009-05-08

打赏
举报

z-index

kuncly 2009-05-07

打赏
举报

好像是css滤镜

mengxj85 2009-05-07

打赏
举报

Up，楼上几位都给出解决方案了，JS+DIV

hmily821023 2009-05-07

打赏
举报



<!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> 

<meta name="Author" content="lsh710,online.hfut.edu.cn" /> 

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 

<title>弹出层</title> 

<style type="text/css"> 

body{ margin:0px; padding:0px;} 

#cover{ position:absolute;top:0px;left:0px;width:100%;height:100%;background-color:#000; 

filter:alpha(opacity=55);/*对应IE*/ 

-moz-opacity: 0.55;/*对应FF*/ 

opacity: 0.55;/*对应Opera*/ 

display:none; 

} 

#tb_window{ 

width:300px; height:100px; border:2px #C60 solid; position:absolute; top:200px;left:400px;z-index:3; background:#FFF;} 



#button{ margin:auto; width:300px; margin-top:200px;} 

</style> 



</head> 



<body> 

<br /> 

<br /><br /> 

<span>我是透明的我是透明的我是透明的我是透明的我是透明的我是透明的我是透明的我是透明的我是透明的我是透明的我是透明的</span> 

<br /><br /> 

<div id="cover"> 

<div id="tb_window"> 

<a href="javascript:hidden()" >关闭</a> 

<div id="messages">里面是你要显示的内容！！！</div> 

</div> 

</div> 



<div id="button"> 

<input type="button" onclick="show('显示1显示1显示1显示1显示1')" value="显示1" /> 



<input type="button" onclick="show('显示222222222222222222')" value="显示2" /> 

</div> 





<script type="text/javascript" language="javascript"> 

function show(messges) 

{ 

document.getElementById("messages").innerHTML="<div id='messages'>"+messges+"！！</div>"; 

document.getElementById("button").style.display = "none"; 

document.getElementById("cover").style.display = "block"; 



} 

function hidden() 

{ 

document.getElementById("cover").style.display = "none"; 

document.getElementById("button").style.display = "block"; 

} 

</script> 

</body> 

</html>

路人乙e 2009-05-07

打赏
举报

<html>
<head>
<script>
function sAlert(src)
{
//var eSrc=(document.all)?window.event.srcElement:arguments[1];
var shield = document.createElement("DIV");
shield.id = "shield";
shield.style.position = "absolute";
shield.style.left = "0px";
shield.style.top = "0px";
shield.style.width = "100%";
shield.style.height = document.body.scrollHeight+"px";
shield.style.background = "#333";
shield.style.textAlign = "center";
shield.style.zIndex = "10000";
shield.style.filter = "alpha(opacity=0)";
shield.style.opacity = 0;
var alertFram = document.createElement("DIV");
alertFram.id="alertFram";
alertFram.style.position = "absolute";
alertFram.style.left = "0%";
alertFram.style.top = "0%";
//alertFram.style.marginLeft = "-225px" ;
//alertFram.style.marginTop = -75+document.documentElement.scrollTop+"px";
alertFram.style.width = "100%";
//alertFram.style.height = "150px";
//alertFram.style.background = "#ccc";
alertFram.style.textAlign = "center";
alertFram.style.lineHeight = "150px";
alertFram.style.zIndex = "10001";

strHtml = "<table align=center cellpadding=0 cellspacing=0>";
strHtml += "<tr><td><img src='"+src+"' border=1/></td></tr>";
strHtml += "<tr><td align=right><a href='javascript:doOk();' style='font-size:11px'>关闭</a></td></tr></table>";
alertFram.innerHTML = strHtml;
document.body.appendChild(alertFram);
document.body.appendChild(shield);
this.setOpacity = function(obj,opacity){
if(opacity>=1)opacity=opacity/100;
try{ obj.style.opacity=opacity; }catch(e){}
try{
if(obj.filters.length>0&&obj.filters("alpha")){
obj.filters("alpha").opacity=opacity*150;
}else{
obj.style.filter="alpha(opacity=\""+(opacity*150)+"\")";
}
}catch(e){}
}
var c = 0;
this.doAlpha = function(){
if (++c > 20){clearInterval(ad);return 0;}
setOpacity(shield,c);
}
var ad = setInterval("doAlpha()",1);
this.doOk = function(){
document.body.removeChild(alertFram);
document.body.removeChild(shield);
document.body.onselectstart = function(){return true;}
document.body.oncontextmenu = function(){return true;}
}
document.body.onselectstart = function(){return false;}
document.body.oncontextmenu = function(){return false;}
}
</script>
</head>
<body>
<input type=button onclick="sAlert('http://hiphotos.baidu.com/qijian100/pic/item/ed4ccc6381288b6d0c33fa04.jpg')" value=登陆>
<div style="height:100px;"></div>
<p align=center><select><option>---</option></select></p>
</body>
</html>

coodd 2009-05-07

打赏
举报

实际是两个div，一个将整个页面盖住，一个在上面显示对话框

冷月孤峰 2009-05-07

打赏
举报

参考：



<html>







<head>



<meta http-equiv="Content-Type" content="text/html; charset=gb2312">



<title> http://hi.csdn.net/YoungEngineer/profile </title>



</head>







<body style="margin:0;">



<div id="topCoverDiv" style="display:none;float:left;z-index:100;position:absolute;top:expression(this.offsetParent.scrollTop);left:expression(this.offsetParent.scrollLeft);width:100%;height:100%;filter:alpha(opacity=90);background-color:#888888;" oncontextmenu="return false;"><div style="z-index:101;position:absolute;top:200px;left:200px;width:200px;height:200px;background-color:#FFFFFF;"><input type=button value="取消页面灰掉" onclick="disableBodyArea(false);" /><a href="http://www.svnhost.cn">SVN托管服务</a></div></div>







<div style="font-size:10pt;">



注1：灰掉页面<br/> 







<br/>  



注：本页面仅在dreamwear下测试过。其它浏览器或其它版本未经测试。改进了一下，IE7下可以关闭了，firefox下还有些缺陷，页面超过一屏时，下边没有遮住。可以写脚本实现。<br/>         



注-----：JK：<a href="mailTo:jk_10000@yahoo.com.cn?subject=About Body">JK_10000@yahoo.com.cn</a><a href="http://www.svnhost.cn">SVN托管服务</a><br/>      



<hr/>  



</div>











<select><option >test</option></select>



<input type=button value="点击将页面灰掉" onclick="disableBodyArea(true);"> 



<br><br><br><br>



<br><br><br><br>



<select><option >test</option></select>



<br><br><br><br>



<br><br><br><br>



<select><option >test</option></select>



<select><option >test</option></select>







</body>







</html>



<script >



function disableBodyArea(f){



    document.getElementById('topCoverDiv').style.display = f? '':'none';



    var allSelects=document.getElementsByTagName("select");



    for(var i=0;i<allSelects.length;i++) {



        allSelects[i].disabled=f;

    }

}

</script>

yiyeqiubo 2009-05-07

打赏
举报

用JavaScript可以解决，具体做法请参考

yuankunliuying 2009-05-07

打赏
举报

这种在样式是可以实现的，遮罩层，在asp.net中Ajax中的弹出窗口就可以实现这种效果

✦双11狂欢大促✦

DIV层问题！

相关推荐

双11狂欢大促