用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 相关文章推荐
游戏人文件夹程序 ver 3.0
Jul 14 Javascript
JS关闭窗口与JS关闭页面的几种方法小结
Dec 17 Javascript
js淡入淡出的图片轮播效果代码分享
Aug 24 Javascript
javascript如何写热点图
Dec 08 Javascript
由简入繁实现Jquery树状结构的方法(推荐)
Jun 10 Javascript
jQuery获取与设置iframe高度的方法
Aug 01 Javascript
原生JS中slice()方法和splice()区别
Mar 06 Javascript
JS回调函数基本定义与用法实例分析
May 24 Javascript
vue2手机APP项目添加开屏广告或者闪屏广告
Nov 28 Javascript
解决Idea、WebStorm下使用Vue cli脚手架项目无法使用Webpack别名的问题
Oct 11 Javascript
Vue 2.0双向绑定原理的实现方法
Oct 23 Javascript
《javascript设计模式》学习笔记四:Javascript面向对象程序设计链式调用实例分析
Apr 07 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编程之高级技巧——利用Mysql函数
2006/10/09 PHP
一步一步学习PHP(5) 类和对象
2010/02/16 PHP
php表单提交问题的解决方法
2011/04/12 PHP
50个PHP程序性能优化的方法
2014/06/02 PHP
PHP实现的简单适配器模式示例
2017/06/22 PHP
详解如何实现Laravel的服务容器的方法示例
2019/04/15 PHP
jQuery的实现原理的模拟代码 -3 事件处理
2010/08/03 Javascript
用JS控制回车事件的代码
2011/02/20 Javascript
JavaScript中的noscript元素属性位置及作用介绍
2013/04/11 Javascript
js单词形式的运算符
2014/05/06 Javascript
js中window.open打开一个新的页面
2014/08/10 Javascript
tuzhu_req.js 实现仿百度图片首页效果
2015/08/11 Javascript
BootStrap框架个人总结(bootstrap框架、导航条、下拉菜单、轮播广告carousel、栅格系统布局、标签页tabs、模态框、菜单定位)
2016/12/01 Javascript
Bootstrap源码解读表单(2)
2016/12/22 Javascript
使用JS实现图片轮播的实例(前后首尾相接)
2017/09/21 Javascript
从源码看angular/material2 中 dialog模块的实现方法
2017/10/18 Javascript
JavaScript框架Angular和React深度对比
2017/11/20 Javascript
Vue用v-for给src属性赋值的方法
2018/03/03 Javascript
react 兄弟组件如何调用对方的方法示例
2018/10/23 Javascript
vue踩坑记录之数组定义和赋值问题
2019/03/20 Javascript
使用npm命令提示: 'npm' 不是内部或外部命令,也不是可运行的程序的处理方法
2020/05/14 Javascript
vue实现一个获取按键展示快捷键效果的Input组件
2021/01/13 Vue.js
[01:18:21]EG vs TNC Supermajor小组赛B组败者组第一轮 BO3 第一场 6.2
2018/06/03 DOTA
Python Logging 日志记录入门学习
2018/06/02 Python
Python 读取某个目录下所有的文件实例
2018/06/23 Python
Python调用shell命令常用方法(4种)
2020/05/11 Python
Python实现发票自动校核微信机器人的方法
2020/05/22 Python
Python基于unittest实现测试用例执行
2020/11/25 Python
AE美国鹰美国官方网站:American Eagle Outfitters
2016/08/22 全球购物
房产转让协议书
2014/04/11 职场文书
常务副总经理岗位职责
2014/04/12 职场文书
大学生励志演讲稿
2014/04/25 职场文书
技校毕业生自荐信
2014/06/03 职场文书
2014教师党员个人自我评议
2014/09/20 职场文书
2014年大学生职业规划书:未来不是梦,只要勇敢冲!
2014/09/22 职场文书
学者《孟子》名人名言
2019/08/09 职场文书