• 一个弹出层的代码


    /*调用<a href="#" onclick="openNewDiv('newDiv');return false;">弹出新层</a>*/
    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 = "200px";
       newDiv.style.height = "300px";
       newDiv.style.top = "100px";
       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 = "关闭激活层";
       newA.onclick = function() {
        document.body.removeChild(docEle(_id));
        document.body.removeChild(docEle(m));
        return false;
       }
       newDiv.appendChild(newA);
    }
    </script>

  • 相关阅读:
    python3.0与python2.0有哪些不同
    python常用内置模块,执行系统命令的模块
    06python 之基本数据类型
    python语言简介、解释器、字符编码介绍
    http协议&接口规范&接口测试入门
    基于APPIUM测试微信公众号的UI自动化测试框架(结合Allure2测试报告框架)
    SQL注入工具sqlmap的注入过程记录
    unittest框架
    测试转型之路--学习ing
    Tomcat分析-启动过程
  • 原文地址:https://www.cnblogs.com/sheseido/p/1862280.html
Copyright © 2020-2023  润新知