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


Posted in Javascript onDecember 31, 2013

用这锻代码 之前请先下载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"); 
} 
}
Javascript 相关文章推荐
表单的一些基本用法与技巧
Jul 15 Javascript
JavaScript setTimeout使用闭包功能实现定时打印数值
Dec 18 Javascript
微信小程序 教程之引用
Oct 18 Javascript
JavaScript中的FileReader图片预览上传功能实现代码
Jul 24 Javascript
微信小程序之数据缓存的实例详解
Sep 29 Javascript
tween.js缓动补间动画算法示例
Feb 13 Javascript
mpvue跳转页面及注意事项
Aug 03 Javascript
详解vue 图片上传功能
Apr 30 Javascript
vue实现自定义H5视频播放器的方法步骤
Jul 01 Javascript
JavaScript中判断为整数的多种方式及保留两位小数的方法
Sep 09 Javascript
Vue v-for循环之@click点击事件获取元素示例
Nov 09 Javascript
一篇文章带你搞懂Vue虚拟Dom与diff算法
Aug 25 Javascript
js类式继承的具体实现方法
Dec 31 #Javascript
利用javascript判断文件是否存在
Dec 31 #Javascript
jquery实现checkbox全选全不选的简单实例
Dec 31 #Javascript
屏蔽IE弹出&quot;您查看的网页正在试图关闭窗口,是否关闭此窗口&quot;的方法
Dec 31 #Javascript
JavaScript的常见兼容问题及相关解决方法(chrome/IE/firefox)
Dec 31 #Javascript
IE与FireFox的JavaScript兼容问题解决办法
Dec 31 #Javascript
jquery遍历select元素(实例讲解)
Dec 31 #Javascript
You might like
PHP数字格式化
2006/12/06 PHP
详解PHP的Yii框架中组件行为的属性注入和方法注入
2016/03/18 PHP
PHP观察者模式实例分析【对比JS观察者模式】
2019/05/22 PHP
JavaScript 开发中规范性的一点感想
2009/06/23 Javascript
原生javascript图片自动或手动切换示例附演示源码
2013/09/04 Javascript
原生js实现改变随意改变div属性style的名称和值的结果
2013/09/26 Javascript
JavaScript使表单中的内容显示在屏幕上的方法
2015/06/29 Javascript
JS如何判断是否为ie浏览器的方法(包括IE10、IE11在内)
2015/12/13 Javascript
thinkphp实现无限分类(使用递归)
2015/12/19 Javascript
jQuery遍历DOM节点操作之filter()方法详解
2016/04/14 Javascript
js转html实体的方法
2016/09/27 Javascript
jquery对象和DOM对象的相互转换详解
2016/10/18 Javascript
Bootstrap整体框架之CSS12栅格系统
2016/12/15 Javascript
Nodejs实现多房间简易聊天室功能
2017/06/20 NodeJs
vue实现商城购物车功能
2017/11/27 Javascript
微信小程序自定义带价格显示日历效果
2018/12/29 Javascript
js时间转换毫秒的实例代码
2019/08/21 Javascript
layer关闭当前窗口页面以及确认取消按钮的方法
2019/09/09 Javascript
Node.JS发送http请求批量检查文件中的网页地址、服务是否有效可用
2019/11/20 Javascript
深入了解Vue3模板编译原理
2020/11/19 Vue.js
小议Python中自定义函数的可变参数的使用及注意点
2016/06/21 Python
在PyCharm环境中使用Jupyter Notebook的两种方法总结
2018/05/24 Python
python中join()方法介绍
2018/10/11 Python
python3实现字符串操作的实例代码
2019/04/16 Python
解决Django 在ForeignKey中出现 non-nullable field错误的问题
2019/08/06 Python
Pandas 解决dataframe的一列进行向下顺移问题
2019/12/27 Python
css3 实现滚动条美化效果的实例代码
2021/01/06 HTML / CSS
MAC Cosmetics官方网站:魅可专业艺术彩妆
2019/04/10 全球购物
美国基督教约会网站:ChristianCafe.com
2020/02/04 全球购物
2014大学生全国两会学习心得体会
2014/03/13 职场文书
合作协议书格式
2014/08/19 职场文书
学生旷课检讨书500字
2014/10/28 职场文书
红高粱观后感
2015/06/10 职场文书
爱国主义主题班会
2015/08/14 职场文书
Three.js实现雪糕地球的使用示例详解
2022/07/07 Javascript
MySQL 原理优化之Group By的优化技巧
2022/08/14 MySQL