<HTML>
<HEAD>
<META http-equiv='Content-Type' content='text/html; charset=gb2312'>
<TITLE>
</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
/**
* 类 名 称: DialogClass
* 功能说明: 禁止页面点击类
* 版权信息: CopyRight 2005-2006 JoeCom
* 创 建 人: JoeCom | MSN:juwuyi@hotmail.com | blog:http://hi.baidu.com/joecom
* 创建日期: 2006-07-21
* 修 改 人:
* 修改日期:
*/
function DialogClass(){
this.blankImgHandle = null;
this.tags = new Array("applet", "iframe", "select","object","embed");
this.body_overflow_y = null;
this.body_overflow_x = null;
this.hideAllSelect = function()
{
for( var k=0;k<this.tags.length;k++)
{
var selects = document.getElementsByTagName(this.tags[k]);
for (var i=0;i<selects.length;i++)
{
selects[i].setAttribute("oldStyleDisplay",selects[i].style.visibility);
selects[i].style.visibility = "hidden";
}
}
}
this.resetAllSelect = function()
{
for( var k=0;k<this.tags.length;k++)
{
var selects = document.getElementsByTagName(this.tags[k]);
for (var i=0;i<selects.length;i++)
{
if (selects[i].getAttribute("oldStyleDisplay")!=null)
selects[i].style.visibility = selects[i].getAttribute("oldStyleDisplay");
}
}
}
this.show = function()
{
this.body_overflow_y = document.body.style.overflowY;
this.body_overflow_x = document.body.style.overflowX;
document.body.style.overflowX = "hidden";
document.body.style.overflowY = "hidden";
this.hideAllSelect();
var w = "100%" ;
var h = "100%" ;
this.blankImgHandle = document.createElement("DIV");
with (this.blankImgHandle.style){
position = "absolute";
left = 0;
top = document.body.scrollTop;
height = "100%";
width = "100%";
zIndex = "9999";
filter = "progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=60)";
opacity = "0.6";
backgroundColor = "#ffffff";
}
document.body.appendChild(this.blankImgHandle);
}
this.close = function(){
document.body.style.overflowY = this.body_overflow_y;
document.body.style.overflowX = this.body_overflow_x;
if (this.blankImgHandle)
{
this.blankImgHandle.parentNode.removeChild(this.blankImgHandle);
}
this.resetAllSelect();
}
}
// End -->
</SCRIPT>
</HEAD>
<BODY >
<button onclick="demo()">DialogClass</button>
<script>
function demo()
{
var dialog = new DialogClass();
dialog.show(); //关闭:dialog.close();
}
</script>
</BODY></HTML>
原理:在整个页面铺一个width=100% ,height=100% 的div,并使z-index为很大的数,从而达到静止页面点击的功能。
转至:http://hi.baidu.com/joecom/blog/item/acb8cf1b1ac9f8faae513352.html
分享到:
相关推荐
这个"javascript经典特效---禁止刷新页面.rar"压缩包文件包含了一个示例,展示了如何使用JavaScript来阻止浏览器的刷新操作。 首先,我们需要理解浏览器的刷新事件。在HTML中,当用户点击浏览器的刷新按钮或者按下...
首先,你需要在页面中引入 jQuery 和 jQuery UI 的 CSS 与 JS 文件。jQuery UI 包含了 Dialog 插件的实现: ```html <!-- 引入 jQuery --> <script src="https://code.jquery.com/jquery-3.x.y.min.js"> <!-- 引入 ...
为了确保`dialog-polyfill`正常工作,你需要在`<head>`标签内引入`dialog-polyfill.css`,并在`<body>`标签结束前引入`dialog-polyfill.js`,以确保在DOM加载完毕后执行JavaScript代码: ```html <!DOCTYPE html> ...
Bootstrap的Dialog.js是一个基于Bootstrap框架的对话框插件,它扩展了Bootstrap的模态(Modal)组件,提供了更丰富的交互性和自定义功能。在网页应用中,对话框常常用于显示警告、确认信息或者进行表单操作,...
"class-inspector"就是这样一款专为前端开发者设计的开源库,它的主要功能是作为类检查器,帮助我们获取类的静态方法和实例方法,从而更好地理解和操作JavaScript对象。 一、什么是class-inspector "class-...
类变压器验证器 一个简单的用于和插件,将它们组合成一个美观且对程序员友好的API。安装模块安装npm install class-transformer-validator --save (或简称): npm i -S class-transformer-validator 对等依赖这个...
首先,确保你的页面已经引入了jQuery库,因为jQuery是dialogBox.js的基础。然后,通过`<script>`标签引入`jquery.dialogBox.js`和相应的CSS样式文件。例如: ```html <script src="js/jquery.min.js"> ...
13-dialog组件-涉及到的深度选择器知识大纲style添加属性scoped原理scoped会给当前组件的模板中所有的元素都添加一个随机的属性scoped会
WebGL是一种基于OpenGL标准的JavaScript API,用于在任何兼容的Web浏览器中实现2D和3D图形渲染。在WebGL编程中,为了提高代码的可重用性和简化复杂任务,通常会使用各种公用函数库。这里提到的"cuon-matrix.js"、...
"js-class-is-master"这个压缩包很可能包含了"class-is"库的源码、示例、文档以及测试用例。源码通常分为几个部分:主文件(可能是`index.js`),可能包含库的核心逻辑;示例文件(如`examples`目录)用来演示如何在...
JavaScript应用实例-0根据图色点击.js
类变压器 它的ES6和Typescript时代。 如今,您比以往更多地使用类和构造函数对象。 类转换器允许您将普通对象转换为类的某些实例,反之亦然。 它还允许根据条件对对象进行序列化/反序列化。 这个工具在前端和后端都...
类验证器可在浏览器和node.js平台上使用。目录安装npm install class-validator --save注意:使用class-validator时,请至少使用npm @ 6。 从npm @ 6开始,依赖关系树被展平,这是class-validator要求的才能正常...
JavaScript应用实例-00-简化点击控件.js
在这个名为"class-of-builtins.rar_class"的压缩包里,包含的两个文件——10.1.5-1.js和class-of-builtins.js,很可能是关于JavaScript中的内置类以及自定义类的示例或教程。 1. **JavaScript 中的类(Class)** ...
JavaScript应用实例-钉钉打卡页面.js
综上所述,"java转js工具"是一个重要的开发辅助工具,它帮助开发者在Java和JavaScript之间架起桥梁,使得跨平台开发变得更加便捷。然而,使用时需要注意语言特性的差异,以及转换过程中可能出现的问题和挑战。
JavaScript应用实例-WebView多页面浏览.js
这个实例“javascript----一个Tab的JS”显然是关于如何使用JavaScript实现网页上的选项卡功能,这对于初学者来说是非常实用的实践项目。选项卡是网页设计中常见的组件,它能有效地组织和展示大量信息,提高用户体验...
在JavaScript编程中,`dialog`通常指的是对话框或者模态框,它是一种用户界面元素,用于向用户显示信息,接收用户输入,或者进行确认操作。本文将深入探讨如何使用JavaScript来实现一个简单的`dialog`功能,包括弹出...