代码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. vim中使用pydiction对python代码进行补全

    在配置完vim插件YouCompleteMe之后,在vim编写python的时候按tab键会报错,E121: Undefined variable: g:pydiction_location Pydi ...

  2. Web框架之Django_09 重要组件（Django中间件、csrf跨站请求伪造）

    摘要 Django中间件 csrf跨站请求伪造 一.Django中间件: 什么是中间件? 官方的说法:中间件是一个用来处理Django的请求和响应的框架级别的钩子.它是一个轻量.低级别的插件系统,用于 ...

  3. Web框架之Django_03 路由层了解（路有层 无名分组、有名分组、反向解析、路由分发 视图层 JsonResponse，FBV、CBV、文件上传）

    摘要: 路由层 无名分组 有名分组 反向解析 路由分发 名称空间 伪静态网页.虚拟环境 视图层 JsonResponse FBV 与 CBV(function base views与class bas ...

  4. 关于json的dump和dumps

    首先说明基本功能: dumps是将dict转化成str格式,loads是将str转化成dict格式. dump和load也是类似的功能,只是与文件操作结合起来了. 1.把python的数据,转换为js ...

  5. OpenGLES2.0着色器语言glsl

    OpenGLES2.0中是强制使用可编程的渲染管线的,使用的是glsl着色器语言,因为着色器语言是使用的GPU,即图形处理单元,而不是CPU,这样可以使CPU从繁重的几何计算和像素的处理中解脱出来了. ...

  6. centos中python2替换为python3，并解决yum出错

    这里采用安装python3.6版本. 安装python3.6可能使用的依赖 yum install openssl-devel bzip2-devel expat-devel gdbm-devel r ...

  7. Java面试——HashCode的作用原理和实例解析

    ,也就是说,我们先通过 HashCode来判断两个类是否存放某个桶里,但这个桶里可能有很多类,那么我们就需要再通过 equals 在这个桶里找到我们要的类. 请看下面这个例子 : public cla ...

  8. Oracle排错总结

    一.Oracle常规恢复之不安全恢复 http://www.cnblogs.com/jyzhao/p/4723994.html#2.11

  9. linux -- 查找（find）命令 一

    find: find命令是非常有用的linux命令,我们可以用它来根据指定的搜索条件来搜索整个文件系统来查找文件或目录. 基本的‘find file’命令 find . -name "foo ...

  10. Mac设置命令别名

    文件中添加 /Users/xxx/.bash_profile 添加别名命令: alias pull='git pull origin' 注意:等号后面不能有空格 从新读取配置文件: source ~/ ...