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 相关文章推荐
基于jquery扩展漂亮的CheckBox(自己编写)
Nov 19 Javascript
js仿土豆网带缩略图的焦点图片切换效果实现方法
Feb 23 Javascript
JavaScript编写连连看小游戏
Jul 07 Javascript
jquery验证邮箱格式并显示提交按钮
Nov 07 Javascript
Javascript BOM学习小结(六)
Nov 26 Javascript
javascript 用函数实现继承详解
May 28 Javascript
jQuery基于toggle实现click触发DIV的显示与隐藏问题分析
Jun 12 Javascript
浅析Vue 生命周期
Jun 21 Javascript
使用Sonarqube扫描Javascript代码的示例
Dec 26 Javascript
JavaScript函数重载操作实例浅析
May 02 Javascript
ant design的table组件实现全选功能以及自定义分页
Nov 17 Javascript
javascript条件式访问属性和箭头函数介绍
Nov 17 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
分享一个PHP数据流应用的简单例子
2012/06/01 PHP
PHP中防止直接访问或查看或下载config.php文件的方法
2012/07/07 PHP
JQuery 表格操作(交替显示、拖动表格行、选择行等)
2009/07/29 Javascript
form表单只提交数据而不进行页面跳转的解决方案
2013/09/18 Javascript
js禁止回车提交表单的示例代码
2013/12/23 Javascript
JS判断客户端是手机还是PC的2个代码
2014/04/12 Javascript
使用JavaScript实现网页版Pongo设计思路及源代码分享
2014/06/16 Javascript
jQuery中get和post方法传值测试及注意事项
2014/08/08 Javascript
JavaScript中Number对象的toFixed() 方法详解
2016/09/02 Javascript
利用JS实现页面删除并重新排序功能
2016/12/09 Javascript
jQuery常见的选择器及用法介绍
2016/12/20 Javascript
微信小程序 radio单选框组件详解及实例代码
2017/01/10 Javascript
Bootstrap Multiselect 常用组件实现代码
2017/07/09 Javascript
JavaScript贪吃蛇小组件实例代码
2017/08/20 Javascript
JavaScript实现的斑马线表格效果【隔行变色】
2017/09/18 Javascript
Node.js上传文件功能之服务端如何获取文件上传进度
2018/02/05 Javascript
Vue filter格式化时间戳时间成标准日期格式的方法
2018/09/16 Javascript
微信小程序HTTP接口请求封装的实现
2019/02/21 Javascript
解决layer.confirm快速点击会重复触发事件的问题
2019/09/23 Javascript
Python使用base64模块进行二进制数据编码详解
2018/01/11 Python
python实现聚类算法原理
2018/02/12 Python
Django ORM多对多查询方法(自定义第三张表&amp;ManyToManyField)
2019/08/09 Python
python mysql自增字段AUTO_INCREMENT值的修改方式
2020/05/18 Python
python 解决selenium 中的 .clear()方法失效问题
2020/09/01 Python
html5中canvas学习笔记2-判断浏览器是否支持canvas
2013/01/06 HTML / CSS
世界上最大的在线旅行社新加坡网站:Expedia新加坡
2016/08/25 全球购物
BASIC HOUSE官方旗舰店:韩国著名的服装品牌
2018/09/27 全球购物
P D PAOLA意大利官网:西班牙著名的珠宝首饰品牌
2019/09/24 全球购物
万豪国际住宅与别墅集团:Homes & Villas by Marriott International
2020/10/08 全球购物
linux面试相关问题
2013/04/28 面试题
上班迟到检讨书
2014/01/10 职场文书
六十大寿答谢词
2014/01/12 职场文书
服装发布会策划方案
2014/05/22 职场文书
班组拓展活动方案
2014/08/14 职场文书
浪漫的婚礼主持词
2015/06/30 职场文书
MySQL系列之开篇 MySQL关系型数据库基础概念
2021/07/02 MySQL