Div全屏遮罩（兼容IE、Firefox、Chrome等主流浏览器）

最新推荐文章于 2021-06-30 21:55:36 发布

godbessinyou

最新推荐文章于 2021-06-30 21:55:36 发布

阅读量250

点赞数

分类专栏： jquery 文章标签： javascript ViewUI

本文链接：https://blog.csdn.net/godbessinyou/article/details/84385061

版权

jquery 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

Div全屏遮罩（兼容IE、Firefox、Chrome等主流浏览器） 
<body>

<Div id="DivLocker"></Div>

其他html元素....

<script language="text/javascript">
    //遮盖DIV样式
        $(document).ready(function(){
            $('#floorDiv').css({
                "position": "absolute",   /*兼容ie6*/
                "margin-left": "1px",
                "margin-top": "1px",
                "background-color": "#000000",
                "height": function () { return $(document).height(); },
                "filter": "alpha(opacity=30)",
                "opacity": "0.3",
                "overflow": "hidden",
                "width": function () { return $(document).width(); },
                "z-index": "100" ,
                "*height": function () { return $(document).height(); },  /*For IE7 & IE6*/
                "_height":  function () { return $(document).height(); }   /*For IE6*/
            });
        });</script>

</body>

注意：

1、<Div id="DivLocker"></Div>须放在Body开始符号之后第一个位置

2、<script>...</script>脚本须放在Body结束之前的最后一个位置（保证页面存在动态生成html代码时可全屏遮罩）

3、如果页面中有大的图片加载在img标签的onload事件中执行<script>...</script>脚本，这样才可全屏遮罩，否则会出现不完全遮罩

godbessinyou

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Div全屏遮罩（兼容IE、Firefox、Chrome等主流浏览器）

Div全屏遮罩（兼容IE、Firefox、Chrome等主流浏览器） &lt;body&gt;&lt;Div id="DivLocker"&gt;&lt;/Div&gt;其他html元素....&lt;script language="text/javascript"&gt; //遮盖DIV样式 $(document).ready(fun...
复制链接

扫一扫