• 全屏圆角弹出框


    <head runat="server">
        <title></title>
        <style type="text/css">
            .b1, .b2, .b3, .b4, .d1, .d2, .d3, .d4,.b
            {
                display: block;
                overflow: hidden;
            }
           
            .b1, .b2, .b3, .d1, .d2, .d3
            {
                height: 1px;
            }
           
            .b2, .b3, .b4, .d2, .d3, .d4, .b
            {
                border-left: 1px solid #999;
                border-right: 1px solid #999;
            }
           
            .b1, .d1
            {
                margin: 0 5px;
                background: #999;
            }
           
            .b2, .d2
            {
                margin: 0 3px;
                border- 2px;
            }
           
            .b3, .d3
            {
                margin: 0 2px;
            }
           
            .b4, .d4
            {
                height: 2px;
                margin: 0 1px;
            }
           
            .backcolor
            {
                background: #9BD1FA;
            }
            .content
            {
                 background-color:White;
                 border:solid 1px #999;  
                 margin-left:8px;
                 margin-right:8px;
            }
            .title
            {
                height:25px;  
            }
            .b
            {
                padding-bottom:5px;   
            }
        </style>
    </head>
    <body style="  margin:5px;">
        <form id="form1" runat="server">
        <div>
            <input type="button" value="Show" onclick="Show()"/>
        </div>
        <div id="WinDiv" style=" position:absolute; top:1px; left:1px; display:none;" >
            <b class="b1"></b><b class="b2 backcolor"></b><b class="b3 backcolor"></b><b class="b4 backcolor"></b>
            <div class="b backcolor">
                <div class="title">
                    <span style=" float:left; margin:2px 0 0 10px;">全屏弹出框</span>
                    <span onclick="document.getElementById('WinDiv').style.display = 'none'" style=" float:right; margin:2px 10px 0 0; cursor:pointer;">关闭</span>
                </div>
                <div id="content" class="content">
                    <iframe id="WinFrame"  frameborder="no" height="100%" width="100%" marginheight="0" marginwidth="0"  scrolling="auto" src="WebForm1.aspx"   ></iframe>
                </div>
            </div>
            <b class="d4 backcolor"></b><b class="d3 backcolor"></b><b class="d2 backcolor"></b><b class="d1">
            </b>
        </div>
        </form>
    </body>
    </html>
    <script type="text/javascript">
        function Show() {
            document.getElementById("WinDiv").style.display = "block";
            document.getElementById("WinDiv").style.height = (document.documentElement.clientHeight - 2) + "px";
            document.getElementById("WinDiv").style.width = (document.documentElement.clientWidth - 2) + "px";
            document.getElementById("content").style.height = (document.documentElement.clientHeight - 44) + "px";
            document.getElementById("content").style.width = (document.documentElement.clientWidth - 22) + "px";
        }
    </script>

  • 相关阅读:
    Docker为PHP安装gd扩展
    git修改远端仓库地址
    Oracle11g R2学习系列 之四Maven+Struts+Spring实验
    Oracle11g R2学习系列 之三教程选择
    Oracle11g R2学习系列 之二基本概念和环境介绍
    西雅图之行
    Oracle11g R2学习系列 之一安装篇
    Startcom SSL证书申请 IIS设置 配置 攻略
    StartCom 申请 SSL 证书及 Nginx HTTPS 支持配置全攻略
    没有了SA密码,无法Windows集成身份登录,DBA怎么办?
  • 原文地址:https://www.cnblogs.com/dengjd/p/3781105.html
Copyright © 2020-2023  润新知