代码Code highlighting produced by Actipro CodeHighlighter (freeware)http://www.CodeHighlighter.com/--><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>

JavaScript 层的更多相关文章

  1. [Javascript] 层控制(隐藏、显示、卷起、展开)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. JavaScript开源跨平台框架NativeScript

    NativeScript是一款使用JavaScript语言来构建跨平台原生移动应用的开源框架,支持iOS.Android和Windows Phone.且NativeScript的使用没有过多繁杂的要求 ...

  3. [欣赏代码片段] (JavaScript) Responsive jQuery

    jQuery(document).ready(function($) { /* getting viewport width*/ var responsive_viewport = $(window) ...

  4. 腾讯Web前端开发框架JX(Javascript eXtension tools)

    转自:Web前端开发-Web前端工程师 » 腾讯Web前端开发框架JX(Javascript eXtension tools) JX – Javascript eXtension tools 一个类似 ...

  5. React-Native系列Android——Native与Javascript通信原理（一）

    React-Native最核心的是Native与Javascript之间的通信,并且是双向通信.Native层到Javascript层,Javascript层到Native层.虽说是两个方向,但实现上 ...

  6. XSS原理

    跨站脚本攻击(Cross-Site Scripting),是一种网站应用程序的安全漏洞,是代码注入攻击的一种.   XSS的种类:   反射型XSS: 非持久型XSS(需要自行触发,输入-输出).  ...

  7. 深入浅出node(3) 异步I/O

    这篇主要整理深入浅出Node.js第三章 异步I/O 一) 异步I/O的原因 二)异步I/O实现现状 2.1 异步I/O与非阻塞I/O 2.2 轮询 2.3 理想的非阻塞异步I/O 2.4 现实的异步 ...

  8. 使用面向 iOS 的本机插件扩展 PhoneGap

    本文细致探讨了 Xcode(以 iOS 设备为目标)中的 PhoneGap(也称为 Apache Cordova)应用程序本机插件.如果您刚开始接触 PhoneGap 或者需要回顾 PhoneGap ...

  9. 让DIV实现抖动效果！

    <html> <head> <meta http-equiv="Content-Type" content="text/html; char ...

随机推荐

  1. CSS3的渐变-gradient

    CSS3 Gradient分为linear-gradient(线性渐变)和radial-gradient(径向渐变). CSS3的线性渐变 一.线性渐变在Mozilla下的应用 语法: -moz-li ...

  2. perl学习之：理解贪婪匹配和最小匹配之间的区别

    正则表达式的新手经常将贪婪匹配和最小匹配理解错误.默认情况下,Perl 的正则表达式是“贪婪地”,也就是说它们将尽可能多地匹配字符. 下面的脚本打印出“matched defgabcdef”,因为它尽 ...

  3. python爬虫基础04-网页解析库xpath

    更简单高效的HTML数据提取-Xpath 本文地址:https://www.jianshu.com/p/90e4b83575e2 XPath 是一门在 XML 文档中查找信息的语言.XPath 用于在 ...

  4. Python数据类型(简单入门)

    数据类型(预了解) 1.数字类型 整型:int 即不带小数点的数,通常用来标识年龄,账号,身份证号,等级等整数. 浮点型:float 即带有小数点的数,通常用来标记身高,体重,科学计算等有小数点的数. ...

  5. 求分数序列的前n项之和

    有一个分数序列 2/1,3/2,5/3,8/5,13/8,21/13,.... 求这个分数序列的前n项之和. 输入 测试数据有多组,其第一行为一个正整数k(0<k<=90),表示测试数据的 ...

  6. PAT Basic 1033

    1033 旧键盘打字 旧键盘上坏了几个键,于是在敲一段文字的时候,对应的字符就不会出现.现在给出应该输入的一段文字.以及坏掉的那些键,打出的结果文字会是怎样? 输入格式: 输入在 2 行中分别给出坏掉 ...

  7. 用ajax异步请求一个块

    使用用户控件,作为一个块,生成一段独立的html. 请求一个一般应用程序,在一般应用程序中加载读取用户控件,并给用户控件传值.     Page page = new Page();          ...

  8. Unity3D for iOS初级教程：Part 2/3

    转自Unity3D for iOS 这篇文章还可以在这里找到 英语 Learn how to use Unity to make a simple 3D iOS game! 这篇教材是来自教程团队成员 ...

  9. 【bzoj1532】[POI2005]Kos-Dicing 二分+网络流最大流

    题目描述 Dicing 是一个两人玩的游戏,这个游戏在Byteotia非常流行. 甚至人们专门成立了这个游戏的一个俱乐部. 俱乐部的人时常在一起玩这个游戏然后评选出玩得最好的人.现在有一个非常不走运的 ...

  10. 【angularjs学习】简单的语法

    <div ng-app="" ng-init="names=[{name:'Jani',country:'Norway'},{name:'Hege',country ...