用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");
}
}
复制代码 代码如下:
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");
}
}
相关文章
这篇文章主要为大家详细介绍了swiper Scrollbar滚动条组件，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2019-09-09
本篇文章主要介绍了javascript的知识点。具有一定的参考价值，下面跟着小编一起来看下吧2017-01-01
这篇文章主要介绍了JS实现仿PS的调色板效果,结合完整实例形式分析了javascript通过运算与动态操作页面元素实现调色板功能的相关操作技巧,具有一定参考借鉴价值,需要的朋友可以参考下2016-12-12
下面小编就为大家带来一篇js实时获取窗口大小变化的实例代码。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2016-11-11
JS OOP包机制,类创建的方法定义,需要的朋友可以参考下。2009-11-11
这篇文章主要为大家介绍了JavaScript函数this指向，具有一定的参考价值，感兴趣的小伙伴们可以参考一下，希望能够给你带来帮助2021-11-11
以下内容基于IE中GIF的onload事件的基础上，故所有测试IE only2007-05-05
在浏览器中使用JavaScript获取本机IP地址是不可行的,因为浏览器的安全策略禁止JavaScript访问这样的信息,这篇文章主要给大家介绍了关于JavaScript获取本机IP地址的三种常用方式,需要的朋友可以参考下2023-12-12
JSON是一种基于文本的数据交换方式，或者叫做数据描述格式，这篇文章主要介绍了JS跨域交互(jQuery+php)之jsonp使用心得的相关资料，非常不错，具有参考借鉴价值，需要的朋友一起学习吧2016-07-07
刚才一个朋友告诉我他的blog友情链接太多了，所以把所有链接放到一个DIV中，加了个滚动条，可是他又不想每次别人来看，看到的都是前面几个链接，于是问我有没有什么办法，想了一个，呵呵，正好有个办法2008-11-11
最新评论