zoukankan      html  css  js  c++  java
  • 弹出层

    <html>
    <body>
    <SCRIPT LANGUAGE="JavaScript">
    <!--
    /*弹出半透明层代码*/
    function ShowNo() //隐藏两个层
    {
    document.getElementById("doing").style.display="none";
    document.getElementById("divInfoShow").style.display="none";
    }
    function $(id)
    {
    return (document.getElementById) ? document.getElementById(id) : document.all[id] ;
    }
    function showFloat() //根据屏幕的大小显示两个层
    {
    var range = getRange();
    $('doing').style.width = range.width + "px";
    $('doing').style.height = range.height + "px";
    $('doing').style.display = "block";
    document.getElementById("divInfoShow").style.display="";
    }
    function getRange() //得到屏幕的大小
    {
    var top = document.body.scrollTop;
    var left = document.body.scrollLeft;
    var height = document.body.clientHeight;
    var width = document.body.clientWidth;

    if (top==0 && left==0 && height==0 && width==0)
    {
    top = document.documentElement.scrollTop;
    left = document.documentElement.scrollLeft;
    height = document.documentElement.clientHeight;
    width = document.documentElement.clientWidth;
    }
    return {top:top ,left:left ,height:height ,width } ;
    }
    /*弹出半透明层代码结束*/
    //-->
    </SCRIPT>
    <!--加一个半透明层-->
    <div id="doing" style="filter: alpha(opacity=30); -moz-opacity: 0.3; opacity: 0.3;
    background-color: #000; 100%; height: 100%; z-index: 1000; position: absolute;
    left: 0; top: 0; display: none; overflow: hidden;">
    </div>
    <!--加一个信息显示层-->
    <div id="divInfoShow" style="border: solid 10px #898989; background: #fff; padding: 10px;
    590px; z-index: 1001; position: absolute; display: none; top: 63%; left: 65%;
    margin: -200px 0 0 -400px; ">
    <div style="padding: 3px 15px 3px 15px; text-align: left; vertical-align: middle;">
    <div align="center">
    <br />
    <br />
    <asp:Label ID="lbl_Info" runat="server">你确定要XXX吗?<br/>点击取消关闭当前窗口。</asp:Label>&nbsp;</div>
    <br />
    <div align="center">
    <input type="button" value="确 定" />&nbsp;
    <input id="BttCancel" type="button" value="取 消" onclick="ShowNo()" /><br />
    <br />
    </div>
    </div>
    </div>
    <input type="button" onclick="showFloat();void(0);"/>
    </body>
    </html>

  • 相关阅读:
    el-table单元格新增、编辑、删除功能
    div 拖拽
    dataTable 分页用法总结
    pc端字体大小计算以及echart中字体大小计算
    pc端字体大小自适应几种方法
    AB PLC教程
    Electric p8激活教程
    三菱FX系列PLC教程
    Visual Studio 2015简体中文企业版/专业版下载+有效激活密钥
    servlet在mvc里的分层,驻留内存的疑问?
  • 原文地址:https://www.cnblogs.com/Areas/p/2373292.html
Copyright © 2011-2022 走看看