用js+iframe形成页面的一种遮罩效果的具体实现

更新时间：2013年12月31日 15:47:36 作者：

用js形成页面的一种遮罩效果，选择想要进行遮罩的窗口，在这里想要遮罩的是一个iframe窗口，具体的实现如下，感兴趣的朋友可以参参考下

用这锻代码之前请先下载jquery库

 
var maskStackCount = 0; 

function mask(method){ 

//这里是你想要进行遮罩的窗口，我这里想要遮罩的是一个iframe窗口，也可以用var winObj=$(window) 

var winObj=window.top.$("body").find("iframe[name='dialognormaliframe']"); 
if(typeof method == "undefined"){ 
method="open"; 
} 
if (method == "open") { 
if (maskStackCount <= 0) { 
var mask = $("<div id='window-mask' class='window-mask' style='display:none'></div>").appendTo("body"); 
mask.css({ 
width: winObj.width() + "px", 
height: winObj.height() + "px", 
filter: "alpha(opacity=60)" 
}).show(); 
winObj.on("resize.mask", function(){ 
mask.css({ 
width: winObj.width() + "px", 
height: winObj.height() + "px" 
}); 
}); 
} 
maskStackCount++; 
} 
else if(method == "close"){ 
maskStackCount--; 
$("#window-mask").remove(); 
winObj.off("resize.mask"); 
} 
} 

您可能感兴趣的文章:

JS二叉树的简单实现方法示例
这篇文章主要介绍了JS二叉树的简单实现方法,结合具体实例形式分析了基于javascript定义二叉树及二叉树节点的遍历、查找、添加、删除及运算相关操作技巧,需要的朋友可以参考下
2017-04-04
uni-app如何实现增量更新功能
这篇文章主要介绍了uni-app如何实现增量更新功能，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2020-01-01
在JavaScript中如何使用宏详解
这篇文章主要给大家介绍了关于在JavaScript中如何使用宏的相关资料，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2021-05-05
深入理解JS实现快速排序和去重
在js面试中快速排序和数组去重是比较常问的面试题，下面小编给大家分享下我对JS实现快速排序和去重的理解，感兴趣的朋友一起看看吧
2016-10-10
微信小程序实现即时通信聊天功能的实例代码
这篇文章主要介绍了微信小程序实现即时通信聊天功能的实例代码,非常不错，具有一定的参考借鉴价值，需要的朋友可以参考下
2018-08-08
JavaScript中的 new 命令
这篇文章主要介绍了JavaScript中的new 命令，本文通过实例代码给大家介绍的非常详细，具有一定的参考借鉴价值,需要的朋友可以参考下
2019-05-05
layui点击左侧导航栏,实现不刷新整个页面,只刷新局部的方法
今天小编就为大家分享一篇layui点击左侧导航栏,实现不刷新整个页面,只刷新局部的方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
2019-09-09
JavaScript中的16进制字符(改进)
后来经过自己的测试，发现将字符转换为十六进制的方法不完善。
2011-11-11
JS请求servlet功能示例
这篇文章主要介绍了JS请求servlet功能,结合具体实例形式分析了javascript使用ajax请求servlet端响应的主要功能代码与相关操作技巧,需要的朋友可以参考下
2017-06-06
JSONP和批量操作功能的实现方法
这篇文章主要介绍了JSONP和批量操作功能的相关资料,非常不错，具有参考借鉴价值，需要的朋友可以参考下
2016-08-08