zoukankan      html  css  js  c++  java
  • js遮罩效果

      今天要实现一个 弹出框居中的问题,由于有滚动条,不知道怎么设置高度. 

     再次 感谢网友提供的源代码.  由于比较急,一时忘记出处,真的很抱歉.


    <style>
     .joinclub
            {
                width: 350px;
                height: 60px;
                padding-left: 20px;
                padding-top: 20px;
                border: 1px solid #a3bad9;
                border-radius: 5px;
                background: #fff;
                padding-top: 10px;
                position: absolute;
                z-index: 99999999;
                display: none;
                left: 50%; /*FF IE7*/
                top: 50%; /*FF IE7*/
                margin-left: -220px !important; /*FF IE7 该值为本身宽的一半 */
                margin-top: -140px !important; /*FF IE7 该值为本身高的一半*/
                margin-top: 0px;
                position: fixed !important; /*FF IE7*/
                position: absolute; /*IE6*/
                _top: expression(eval(document.compatMode && document.compatMode=='CSS1Compat') ? documentElement.scrollTop + (document.documentElement.clientHeight-this.offsetHeight)/2 :/*IE6*/
     document.body.scrollTop + (document.body.clientHeight - this.clientHeight)/2); /*IE5 IE5.5*/
            }
            .bg123
            {
                background-color: #ccc;
                width: 100%;
                height: 100%;
                z-index: 99999998;
                left: 0;
                top: 0; /*FF IE7*/
                filter: alpha(opacity=50); /*IE*/
                opacity: 0.5; /*FF*/
                position: fixed !important; /*FF IE7*/
                position: absolute; /*IE6*/
                _top: expression(eval(document.compatMode && document.compatMode=='CSS1Compat') ? documentElement.scrollTop + (document.documentElement.clientHeight-this.offsetHeight)/2 :/*IE6*/
     document.body.scrollTop + (document.body.clientHeight - this.clientHeight)/2); /*IE5 IE5.5*/
            }
    
    </style>

     下面这一段代码 要放在 </body>和</html>之间

    </body>
    <div class="joinclub" id="joinclub" style="display: none">
        我是遮罩中间的提示框
        <input type="button" value="关闭我" onclick="closeCustomer()" />
    </div>
    <div id="bg123" alt="我是遮罩的背景色" class="bg123" style="display: none;">
    </div>
    <script type="text/javascript">
        function closeCustomer() {
            document.getElementById("joinclub").style.display = 'none';
            document.getElementById("bg123").style.display = 'none';
        }
        function join_club() {
                $("#joinclub").html($("#div_hid").html());
                document.getElementById('joinclub').style.display = 'block';
                document.getElementById('bg123').style.display = 'block';
        }
    </script>
    </html>
    

      

    感谢

  • 相关阅读:
    取近似值
    eclipse 自己主动为getter和setter加入中文凝视
    Linux对外连接port数限制
    C++链表冒泡,归并,插入排序(纯指针)
    Android之实现ViewPager+Fragment左右滑动
    获得鼠标离开消息。
    CMFCPropertyGridProperty的使用
    阅读书单
    Docker 容器管理
    docker rmi 详解
  • 原文地址:https://www.cnblogs.com/mjxxsc/p/4512000.html
Copyright © 2011-2022 走看看