JavaScript 层
代码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 层的更多相关文章
- [Javascript] 层控制(隐藏、显示、卷起、展开)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- JavaScript开源跨平台框架NativeScript
NativeScript是一款使用JavaScript语言来构建跨平台原生移动应用的开源框架,支持iOS.Android和Windows Phone.且NativeScript的使用没有过多繁杂的要求 ...
- [欣赏代码片段] (JavaScript) Responsive jQuery
jQuery(document).ready(function($) { /* getting viewport width*/ var responsive_viewport = $(window) ...
- 腾讯Web前端开发框架JX(Javascript eXtension tools)
转自:Web前端开发-Web前端工程师 » 腾讯Web前端开发框架JX(Javascript eXtension tools) JX – Javascript eXtension tools 一个类似 ...
- React-Native系列Android——Native与Javascript通信原理(一)
React-Native最核心的是Native与Javascript之间的通信,并且是双向通信.Native层到Javascript层,Javascript层到Native层.虽说是两个方向,但实现上 ...
- XSS原理
跨站脚本攻击(Cross-Site Scripting),是一种网站应用程序的安全漏洞,是代码注入攻击的一种. XSS的种类: 反射型XSS: 非持久型XSS(需要自行触发,输入-输出). ...
- 深入浅出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 现实的异步 ...
- 使用面向 iOS 的本机插件扩展 PhoneGap
本文细致探讨了 Xcode(以 iOS 设备为目标)中的 PhoneGap(也称为 Apache Cordova)应用程序本机插件.如果您刚开始接触 PhoneGap 或者需要回顾 PhoneGap ...
- 让DIV实现抖动效果!
<html> <head> <meta http-equiv="Content-Type" content="text/html; char ...
随机推荐
- CentOS 7 编译 mysql 8.0.12
步骤一:安装mysql依赖 yum install -y libaio numactl 步骤二:下载mysql社区版 wget https://dev.mysql.com/get/Downloads/ ...
- MariaDB数据库(三)
1. 基本查询 查询基本使用包括:条件.排序.聚合函数.分组和分页. 实例详解查询 1> 创建students表用作实验 MariaDB [testdb]> drop table stud ...
- FTP实验报告
FTP实验报告 制作人:全心全意 准备工作: linux1:192.168.100.4 关闭防火墙.selinux机制 配置yum源 匿名访问 1.安装vsftpd服务和客户端 [root@local ...
- STM32中如何对printf函数重定向
通过USART1向计算机的串口调试助手打印数据,或者接收计算机串口调试助手的数据,接下来我们现STM32工程上的printf()函数,方便用于程序开发中调试信息的打印. 方法一:使用MicroLIB库 ...
- 用python计算100以内的素数
用python计算100以内的素数 : break else: list.append(i)print(list)
- 【LeetCode】Combination Sum II(组合总和 II)
这道题是LeetCode里的第40道题. 题目要求: 给定一个数组 candidates 和一个目标数 target ,找出 candidates 中所有可以使数字和为 target 的组合. can ...
- 奇奇怪怪的冒泡排序 TOJ 2014: Scramble Sort
粘贴两个特别简单的冒泡排序 2014: Scramble Sort Description In this problem you will be given a series of lists co ...
- 【java基础 6】java的发展史简介
结合到近期在做springboot框架开发遇到的关于jdk版本的问题,本篇博客,主要介绍一下java的发展历史,侧重纯文介绍每个版本的特性.--主要从理论上做个宏观的了解,不做具体的技术研究讨论! 一 ...
- 九度oj 题目1016:火星A+B
题目描述: 读入两个不超过25位的火星正整数A和B,计算A+B.需要注意的是:在火星上,整数不是单一进制的,第n位的进制就是第n个素数.例如:地球上的10进制数2,在火星上记为“1,0”,因为 ...
- JAVA如何解压缩ZIP文档
代码片段: package org.yu.units; import java.io.Closeable; import java.io.File; import java.io.FileInputS ...