js形成页面的一种遮罩效果实例代码


Posted in Javascript onJanuary 04, 2014

用这锻代码 之前请先下载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 相关文章推荐
动态加载iframe
Jun 16 Javascript
Prototype源码浅析 Number部分
Jan 16 Javascript
JavaScript中的style.display属性操作
Mar 27 Javascript
动态创建script标签实现跨域资源访问的方法介绍
Feb 28 Javascript
jquery读取xml文件实现省市县三级联动的方法
May 29 Javascript
微信小程序 支付后台java实现实例
May 09 Javascript
微信小程序自定义select下拉选项框组件的实现代码
Aug 28 Javascript
vue--点击当前增加class,其他删除class的方法
Sep 15 Javascript
angularjs1.5 组件内用函数向外传值的实例
Sep 30 Javascript
在element-ui的el-tree组件中用render函数生成el-button的实例代码
Nov 05 Javascript
Element的el-tree控件后台数据结构的生成以及方法的抽取
Mar 05 Javascript
JavaScript选择器函数querySelector和querySelectorAll
Nov 27 Javascript
JavaScript将数据转换成整数的方法
Jan 04 #Javascript
jquery.post用法关于type设置问题补充
Jan 03 #Javascript
JQuery处理json与ajax返回JSON实例代码
Jan 03 #Javascript
jquery.post用法示例代码
Jan 03 #Javascript
简单的代码实现jquery定时器
Jan 03 #Javascript
jquery将一个表单序列化为一个对象的方法
Jan 03 #Javascript
jQuery的DOM操作之删除节点示例
Jan 03 #Javascript
You might like
js下函数般调用正则的方法附代码
2008/06/22 PHP
逆序二维数组插入一元素的php代码
2012/06/08 PHP
如何实现php图片等比例缩放
2015/07/28 PHP
今天你说520了吗?不仅有php表白书还有java表白神器
2016/05/20 PHP
php验证码生成器
2017/05/24 PHP
php strftime函数的详细用法
2018/06/21 PHP
laravel 实现设置时区的简单方法
2019/10/10 PHP
js 颜色选择器(兼容firefox)
2009/03/05 Javascript
cookie丢失问题(认证失效) Authentication (用户验证信息)也会丢失
2009/06/04 Javascript
javascript学习笔记(十) js对象 继承
2012/06/19 Javascript
js中parseFloat(参数1,参数2)定义和用法及注意事项
2013/01/27 Javascript
JSP跨iframe如何传递参数实现代码
2013/09/21 Javascript
JS+CSS实现下拉列表框美化效果(3款)
2015/08/15 Javascript
javascript针对不确定函数的执行方法
2015/12/16 Javascript
JS实现的简单轮播图运动效果示例
2016/12/22 Javascript
vue组件父子间通信详解(三)
2017/11/07 Javascript
es6新特性之 class 基本用法解析
2018/05/05 Javascript
再也不怕 JavaScript 报错了,怎么看怎么处理都在这儿
2020/12/09 Javascript
Python使用poplib模块和smtplib模块收发电子邮件的教程
2016/07/02 Python
浅谈python对象数据的读写权限
2016/09/12 Python
利用python写个下载teahour音频的小脚本
2017/05/08 Python
linux安装python修改默认python版本方法
2019/03/31 Python
python网络编程socket实现服务端、客户端操作详解
2020/03/24 Python
TensorFlow Autodiff自动微分详解
2020/07/06 Python
土木建筑学生自我评价
2014/01/14 职场文书
团日活动总结书格式
2014/05/08 职场文书
户籍证明书标准模板
2014/09/10 职场文书
2014大学生中国梦主题教育学习思想汇报
2014/09/10 职场文书
党员教师个人对照检查材料(群众路线)
2014/09/26 职场文书
2015年个人审计工作总结
2015/04/07 职场文书
校园安全主题班会
2015/08/12 职场文书
2019生态环境保护倡议书!
2019/07/03 职场文书
Python基础之元组与文件知识总结
2021/05/19 Python
详解Laravel制作API接口
2021/05/31 PHP
nginx中proxy_pass各种用法详解
2021/11/07 Servers
详解Vue中$props、$attrs和$listeners的使用方法
2022/02/18 Vue.js