打开页面弹出一层DIV 的成效
日期：2014-05-16 浏览次数：20441 次
打开页面弹出一层DIV 的效果
谁给调一下 像一号店那样的效果 这个应咱写才能弄成他那样的 打开页面时出显示这个页面点击出现的样式
<!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 http-equiv="Content-Type" content="text/html; charset=gb2312" />
<style>
.ie{width:400px; background-color:#FFFFFF; border:1px solid #000000; padding:20px; overflow:hidden; display:none}
</style>
<title>无标题文档</title>
<script language="JavaScript" type="text/javascript">
//|------------------------------------------------
//|
//| 说明：JS弹出全屏遮盖的对话框(弹出层后面有遮盖效果，兼容主流浏览器)
//| 实现了在最大化、拖动改变窗口大小和拖动滚动条时都可居中显示。
//|
//| 注意：主要使用EV_modeAlert和EV_closeAlert这两个函数行了；
//| (EV_modeAlert-弹出对话框，EV_closeAlert-关闭对话框)；
//| 注意：使用时，请在body标签内(不要在其它元素内)写一div，
//| 再给这div赋一id属性，如：id="myMsgBox"，
//| 然后就可以调用EV_modeAlert('myMsgBox')来显示了。
//| 还有，请给你这div设置css：display:none让它在开始时不显示。
//|------------------------------------------------
//|
//用来记录要显示的DIV的ID值
var EV_MsgBox_ID="";
//重要
//弹出对话窗口(msgID-要显示的div的id)
function
EV_modeAlert(msgID)
{
//创建大大的背景框
var bgObj=document.createElement("div");
bgObj.setAttribute('id','EV_bgModeAlertDiv');
document.body.appendChild(bgObj);
//背景框满窗口显示
EV_Show_bgDiv();
//把要显示的div居中显示
EV_MsgBox_ID=msgID;
EV_Show_msgDiv();
}
//关闭对话窗口
function EV_closeAlert(){
var msgObj=document.getElementById(EV_MsgBox_ID);
var bgObj=document.getElementById("EV_bgModeAlertDiv");
msgObj.style.display="none";
document.body.removeChild(bgObj);
EV_MsgBox_ID="";
}
//窗口大小改变时更正显示大小和位置
window.onresize=function(){
if (EV_MsgBox_ID.length>0){
EV_Show_bgDiv();
EV_Show_msgDiv();
}
}
//窗口滚动条拖动时更正显示大小和位置
window.onscroll=function(){
if (EV_MsgBox_ID.length>0){
EV_Show_bgDiv();
EV_Show_msgDiv();
}
}
//把要显示的div居中显示
function EV_Show_msgDiv(){
var msgObj = document.getElementById(EV_MsgBox_ID);
msgObj.style.display = "block";
var msgWidth = msgObj.scrollWidth;
var msgHeight= msgObj.scrollHeight;
var bgTop=EV_myScrollTop();
var bgLeft=EV_myScrollLeft();
var bgWidth=EV_myClientWidth();
var bgHeight=EV_myClientHeight();
var msgTop=bgTop+Math.round((bgHeight-msgHeight)/2);
var msgLeft=bgLeft+Math.round((bgWidth-msgWidth)/2);
msgObj.style.position = "absolute";
msgObj.style.top = msgTop+"px";
msgObj.style.left = msgLeft+"px";
msgObj.style
谁给调一下 像一号店那样的效果 这个应咱写才能弄成他那样的 打开页面时出显示这个页面点击出现的样式
<!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 http-equiv="Content-Type" content="text/html; charset=gb2312" />
<style>
.ie{width:400px; background-color:#FFFFFF; border:1px solid #000000; padding:20px; overflow:hidden; display:none}
</style>
<title>无标题文档</title>
<script language="JavaScript" type="text/javascript">
//|------------------------------------------------
//|
//| 说明：JS弹出全屏遮盖的对话框(弹出层后面有遮盖效果，兼容主流浏览器)
//| 实现了在最大化、拖动改变窗口大小和拖动滚动条时都可居中显示。
//|
//| 注意：主要使用EV_modeAlert和EV_closeAlert这两个函数行了；
//| (EV_modeAlert-弹出对话框，EV_closeAlert-关闭对话框)；
//| 注意：使用时，请在body标签内(不要在其它元素内)写一div，
//| 再给这div赋一id属性，如：id="myMsgBox"，
//| 然后就可以调用EV_modeAlert('myMsgBox')来显示了。
//| 还有，请给你这div设置css：display:none让它在开始时不显示。
//|------------------------------------------------
//|
//用来记录要显示的DIV的ID值
var EV_MsgBox_ID="";
//重要
//弹出对话窗口(msgID-要显示的div的id)
function
EV_modeAlert(msgID)
{
//创建大大的背景框
var bgObj=document.createElement("div");
bgObj.setAttribute('id','EV_bgModeAlertDiv');
document.body.appendChild(bgObj);
//背景框满窗口显示
EV_Show_bgDiv();
//把要显示的div居中显示
EV_MsgBox_ID=msgID;
EV_Show_msgDiv();
}
//关闭对话窗口
function EV_closeAlert(){
var msgObj=document.getElementById(EV_MsgBox_ID);
var bgObj=document.getElementById("EV_bgModeAlertDiv");
msgObj.style.display="none";
document.body.removeChild(bgObj);
EV_MsgBox_ID="";
}
//窗口大小改变时更正显示大小和位置
window.onresize=function(){
if (EV_MsgBox_ID.length>0){
EV_Show_bgDiv();
EV_Show_msgDiv();
}
}
//窗口滚动条拖动时更正显示大小和位置
window.onscroll=function(){
if (EV_MsgBox_ID.length>0){
EV_Show_bgDiv();
EV_Show_msgDiv();
}
}
//把要显示的div居中显示
function EV_Show_msgDiv(){
var msgObj = document.getElementById(EV_MsgBox_ID);
msgObj.style.display = "block";
var msgWidth = msgObj.scrollWidth;
var msgHeight= msgObj.scrollHeight;
var bgTop=EV_myScrollTop();
var bgLeft=EV_myScrollLeft();
var bgWidth=EV_myClientWidth();
var bgHeight=EV_myClientHeight();
var msgTop=bgTop+Math.round((bgHeight-msgHeight)/2);
var msgLeft=bgLeft+Math.round((bgWidth-msgWidth)/2);
msgObj.style.position = "absolute";
msgObj.style.top = msgTop+"px";
msgObj.style.left = msgLeft+"px";
msgObj.style
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
