【转】JS写图层方法.document.createElement("div")

来源:互联网 发布:手机锁软件 编辑:程序博客网 时间:2024/05/17 22:36
<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 = "关闭";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>

该文章转载自网络大本营:http://www.xrss.cn/Info/14120.Html




如果当前窗口含有滚动条,要让生成的div居中显示:

var w = jQuery(myAlert).innerWidth(),h = jQuery(myAlert).innerHeight();jQuery(myAlert).css({'position':'fixed','top':'50%','left':'50%','margin-top':-(h/2),'margin-left':-(w/2)}).show();

myAlert是要弹出的div,fixed表示不随滚动条滚动,w和h算出来的是div的高和宽

0 0
原创粉丝点击