zoukankan      html  css  js  c++  java
  • JavaScript 层

    代码
    <script language="javascript">
    var docEle = function() {
    return document.getElementById(arguments[0]) || false;
    }
    function openNewDiv(_id) {
    var m = "mask";
    if (docEle(_id)) document.removeChild(docEle(_id));
    if (docEle(m)) document.removeChild(docEle(m));

    // 新激活图层
    var newDiv = document.createElement("div");
    newDiv.id 
    = _id;
    newDiv.style.position 
    = "absolute";
    newDiv.style.zIndex 
    = "9999";
    newDiv.style.width 
    = "500px";
    newDiv.style.height 
    = "300px";
    newDiv.style.top 
    = "50px";
    newDiv.style.left 
    = (parseInt(document.body.scrollWidth) - 300/ 2 + "px"// 屏幕居中
    newDiv.style.background = "#EFEFEF";
    newDiv.style.border 
    = "1px solid #860001";
    newDiv.style.padding 
    = "5px";
    newDiv.innerHTML 
    = "新激活图层内容   ";
    document.body.appendChild(newDiv);

    // mask图层
    var newMask = document.createElement("div");
    newMask.id 
    = m;
    newMask.style.position 
    = "absolute";
    newMask.style.zIndex 
    = "1";
    newMask.style.width 
    = document.body.scrollWidth + "px";
    newMask.style.height 
    = document.body.scrollHeight + "px";
    newMask.style.top 
    = "0px";
    newMask.style.left 
    = "0px";
    newMask.style.background 
    = "#000";
    newMask.style.filter 
    = "alpha(opacity=40)";
    newMask.style.opacity 
    = "0.40";
    document.body.appendChild(newMask);
    // 关闭mask和新图层

    var newA = document.createElement("a");
    newA.href 
    = "#";
    newA.innerHTML 
    = "X";
    newA.onclick 
    = function() {
      document.body.removeChild(docEle(_id));
      document.body.removeChild(docEle(m));
      
    return false;
    }
    newDiv.appendChild(newA);
    }
    </script>
    <body>
    <a href="#" onclick="openNewDiv('newDiv');return false;">激活新层</a>
    <p> 网页内容网页内容网页内容</p>
    <p>网页内容网页内容网页内容</p>
    </body> 


  • 相关阅读:
    一、 IO 五种模型
    Spring核心IoC和AOP的理解
    spring读取properties文件配置使用
    Linux下的SVN服务器搭建
    Can't open and lock privilege tables: Table 'mysql.user' doesn't exist
    时间戳函数
    用户,角色,权限对象
    程序翻译文本传输请求创建
    ALV值存放图标
    函数的异步、延迟调用
  • 原文地址:https://www.cnblogs.com/no7dw/p/1753492.html
Copyright © 2011-2022 走看看