window.open实现模式窗口(只弹出一个window.open)
父页面
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>父窗口</title>
<script src="../Scripts/openModal.js"></script><!--引用遮罩层JS-->
<script language="javascript">
window.onfocus = getFocus;
window.onclick = getFocus;
function getFocus() {
if (typeof (window.childWindow) != "undefined") {//如果子窗口存在,将焦点转到子窗口
window.childWindow.focus();
}
}
function showChild() {
EV_modeAlert();//弹出遮罩层
window.childWindow = window.open("child.html", "child", "width=300px,height=110px,resizable=no,scroll=no,status=no");
window.childWindow.focus();//子窗口获取焦点
}
</script>
</head> <body>
<input name="btn_show" type="button" value="显示子窗口" onclick="showChild()" />
</body>
</html>
子页面
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"/>
<script src="../Scripts/openModal.js"></script><!--引用遮罩层JS-->
<title>子页面</title>
<script language="javascript">
window.onunload = function () { EV_closeAlert(); }//窗口关闭时去掉遮罩效果
</script>
</head>
<body>
</body>
</html>
JS
var EV_MsgBox_ID = "EV_bgModeHideDiv";
//重要
//弹出对话窗口(msgID-要显示的div的id)
function EV_modeAlert() {
//创建大大的背景框
var hideDiv = document.createElement("div");
hideDiv.id = EV_MsgBox_ID;
hideDiv.style.display = "none";
var bgObj = document.createElement("div");
bgObj.setAttribute('id', 'EV_bgModeAlertDiv');
document.body.appendChild(hideDiv);
document.body.appendChild(bgObj);
//背景框满窗口显示
EV_Show_bgDiv();
//把要显示的div居中显示
EV_Show_msgDiv();
}
//关闭对话窗口
function EV_closeAlert() {
var msgObj = window.opener.document.getElementById(EV_MsgBox_ID);
var bgObj = window.opener.document.getElementById("EV_bgModeAlertDiv");
msgObj.style.display = "none";
window.opener.document.body.removeChild(bgObj);
window.opener.document.body.removeChild(msgObj);
EV_MsgBox_ID = "";
} //把要显示的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.zIndex = "10001"; }
//背景框满窗口显示
function EV_Show_bgDiv() {
var bgObj = document.getElementById("EV_bgModeAlertDiv");
var bgWidth = EV_myClientWidth();
var bgHeight = EV_myClientHeight();
var bgTop = EV_myScrollTop();
var bgLeft = EV_myScrollLeft();
bgObj.style.position = "absolute";
bgObj.style.top = bgTop + "px";
bgObj.style.left = bgLeft + "px";
bgObj.style.width = bgWidth + "px";
bgObj.style.height = bgHeight + "px";
bgObj.style.zIndex = "10000";
bgObj.style.background = "#777";
bgObj.style.filter = "progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=60,finishOpacity=60);";
bgObj.style.opacity = "0.6";
}
//网页被卷去的上高度
function EV_myScrollTop() {
var n = window.pageYOffset
|| document.documentElement.scrollTop
|| document.body.scrollTop || 0;
return n;
}
//网页被卷去的左宽度
function EV_myScrollLeft() {
var n = window.pageXOffset
|| document.documentElement.scrollLeft
|| document.body.scrollLeft || 0;
return n;
}
//网页可见区域宽
function EV_myClientWidth() {
var n = document.documentElement.clientWidth
|| document.body.clientWidth || 0;
return n;
}
//网页可见区域高
function EV_myClientHeight() {
var n = document.documentElement.clientHeight
|| document.body.clientHeight || 0;
return n;
}
window.open实现模式窗口(只弹出一个window.open)的更多相关文章
- ASP.NET查询页面设置form的action属性只弹出一个页面,并且每次将页面设置到最前
原文:ASP.NET查询页面设置form的action属性只弹出一个页面,并且每次将页面设置到最前 背景 当数据量大.查询条件复杂,多样多的时候,我们可能需要单独做一个查询界面,当用户选择设置了相关的 ...
- selenium获取新页面标签页(只弹出一个新页面的切换)
selenium获取新页面标签页(只弹出一个新页面的切换) windows = driver.current_window_handle #定位当前页面句柄 all_handles = driver. ...
- JS只弹出一个居中弹出窗口
var newWindow;//定义一个窗口,有利于窗口间的通讯function makeNewWindow(url) { if (!newWindow || newWindow.closed) ...
- 利用cookie实现“只弹出一次窗口”的JS代码
弹出式窗口通常被用来做弹出广告(CPM),其实用弹出式窗口用来做消息通知也是最普遍而且是最有效的方法,但如果每次刷新页面特别是刷新首页都要弹出窗口的话,那绝对是让访问者厌烦的事情. 比如你将上面的脚本 ...
- window.open实现模式窗口
看了些文章,实现模式窗口有两种方式.window.showModalDialog以及window.open. 一.方式介绍 window.open()支持环境: JavaScript1.0+/JScr ...
- 在Winform框架的多文档界面中实现双击子窗口单独弹出或拖出及拽回的处理
在基于DevExpress的多文档窗口界面中,我们一般使用XtraTabbedMdiManager来管理多文档窗口的一些特性,如顶部菜单,页面的关闭按钮处理,以及一些特殊的设置,本篇随笔介绍这些特点, ...
- android在桌面弹出一个窗口
android在桌面弹出一个窗口 遇到了这种需求,要和iPhone一样的效果. 下面是简单实现功能,优化和美化部分,有时间慢慢搞. 方法应该有不少吧,我用的是弹出一个activity,将这个activ ...
- 用MPLAB IDE编程时,软件总是弹出一个窗口提示: “the extended cpu mode configuration bit is enabled,but the program that was loaded was not built using extended cpu instructions. therefore,your code may not work properly
用MPLAB IDE编程时,软件总是弹出一个窗口提示:"the extended cpu mode configuration bit is enabled,but the program ...
- 通过script src引入ElementUI时,使用语句:window.ELEMENT.MessageBox.alert(xxx) 调用弹出框
通过script src引入ElementUI时,使用语句:window.ELEMENT.MessageBox.alert(xxx) 调用弹出框.
随机推荐
- 更有效率的使用Visual Studio2
PS色调均化滤镜的快捷实现(C#源代码). photoshop色调均化功能通常是在进行修片处理前期比较常用的功能之一,其对扩展图像的对比度,增强视觉效果有一定的作用.在很多课本或者文章中,也称这种处理 ...
- 关于Symfony2+nginx搭建过程总结
关于Symfony2+nginx搭建过程总结 最近在试着用nginx+symfony搭建公司的网站,由于nginx不支持pathinfo模式,所以必须修改nginx(我使用的是nginx1.5.1)的 ...
- Android 检测是否连接蓝牙耳机
前言 欢迎大家我分享和推荐好用的代码段~~ 声明 欢迎转载,但请保留文章原始出处: CSDN:http://www.csdn.net ...
- 从0到1一步步搭建代码质量检测系统~iOS
演示环境:Mac OSX10.12.2 Xcode8 先瞄一眼最终成果- 1.JDK,DBMS(演示环境使用Mysql) 2.创建sonar数据库和用户 mysql -u root -pCREATE ...
- ROC与AUC
一.ROC曲线 1.ROC曲线:接收者操作特征(receiveroperating characteristic),ROC曲线上每个点反映着对同一信号刺激的感受性. 横轴:负正类率(false pos ...
- iOS 10 之后,相机权限问题及易出现的Crash
1: iOS 10 之后,访问相机需要设置相关的权限 麦克风权限:Privacy - Microphone Usage Description 是否允许此App使用你的麦克风? 相机权限: Priva ...
- 消息推送之androidpn部署
androidpn客户端的部署在eclipse上,要记住两点: 1.直接导入的项目是上个世纪的lib这个文件夹,要改为libs.否则会报错找不到云云类. 2.如果在虚拟器上测试,要将res/raw/a ...
- ListView的局部刷新
有的列表可能notifyDataSetChanged()代价有点高,最好能局部刷新. 局部刷新的重点是,找到要更新的那项的View,然后再根据业务逻辑更新数据即可. private void upda ...
- 第12章 MySQL高级管理
1.手动更新权限后,需向服务器指出已对权限进行修改: (在MySQL提示符下)flush privileges; 2.查看用户所拥有的权限: 如: show grants for bookorama; ...
- Tiny6410之重定位代码到SRAM+4096
重定位代码 两个不同的地址概念: 对于程序而言,需要理解两个地址,一个是程序当前所处的地址,即程序运行时所处的当前地址.二是程序应该位于的运行地址,即编译程序时所指定的程序的链接地址.在Tiny641 ...