/*
适用原生JS
*/
function showInfo(info) {
    var zzInfo = info;
    var mask_bg = document.createElement("div");
    mask_bg.id = "mask_bg";
    mask_bg.style.position = "absolute";
    mask_bg.style.top = "0px";
    mask_bg.style.left = "0px";
    mask_bg.style.width = "100%";
    mask_bg.style.height = "100%";
    mask_bg.style.backgroundColor = "white";
    mask_bg.style.filter='alpha(opacity:'+10+')';
    mask_bg.style.opacity = 0.6;
    mask_bg.style.zIndex = 10001;
    document.body.appendChild(mask_bg);
    var mask_msg = document.createElement("div");
    mask_msg.style.position = "absolute";
    mask_msg.style.top = "30%";
    mask_msg.style.left = "25%";
    mask_msg.style.backgroundColor = "black";
    mask_msg.style.color = "white";
    mask_msg.style.border = "#336699 0px solid";
    mask_msg.style.textAlign = "center";
    mask_msg.style.fontSize = "2.1em";
    mask_msg.style.fontWeight = "bold";
    mask_msg.style.filter='alpha(opacity:'+5+')';
    mask_msg.style.padding = "0.5em 3em 0.5em 3em";
    mask_msg.style.zIndex = 10002;
    mask_msg.innerText = ""+zzInfo+"";
    mask_bg.appendChild(mask_msg);

原生JavaScript遮罩的更多相关文章

  1. 四种常见的提示弹出框(success,warning,error,loading)原生JavaScript和jQuery分别实现

    原文:四种常见的提示弹出框(success,warning,error,loading)原生JavaScript和jQuery分别实现 虽然说现在官方的自带插件已经有很多了,但是有时候往往不能满足我们 ...

  2. 原生javascript 实现 animate

    原生javascript 实现 animate //animate function getstyle(obj,name){ if(obj.currentStyle){ return obj.curr ...

  3. 浅谈 原生javaScript&&react 实现全局触摸按钮(附带对addeventlistener的了解)

    1.采用原生javaACript 实现全局触摸按钮 首先在控制台输出,观察事件有哪些关于触摸的字段可以使用,然后拿这些字段的数据开始来写方法. 因为要做的是全局触摸按钮,我需要拿到的是按钮时时的坐标位 ...

  4. 你可能不需要 jQuery!使用原生 JavaScript 进行开发

    很多的 JavaScript 开发人员,包括我在内,都很喜欢 jQuery.因为它的简单,因为它有很多丰富的插件可供使用,和其它优秀的工具一样,jQuery 让我们开发人员能够更轻松的开发网站和 We ...

  5. 原生JavaScript技巧大收集(11~20)-(终于又被我找到这篇文章了)

    11.原生JavaScript加入收藏夹 function AddFavorite(sURL, sTitle) { try { window.external.addFavorite(sURL, sT ...

  6. 原生javascript加载运行

    原生javascript加载运行 (function(){ //TODO sometings }()); 在要运行相应代码的位置加入script标签,创建函数并自执行; 关于window.onload ...

  7. 原生javascript模仿win8等待进度条。

    一.序言 一直很中意win8等待提示圆圈进度条.win8刚出来那会,感觉好神奇!苦于当时没思路,没去研究.通过最近网上找找资料,终于给搞出来了!先上Demo,献丑了!预览请看:win8进度条. 二.简 ...

  8. 表单美化-原生javascript和jQuery单选按钮(兼容IE6)

    最近很多人问怎么美化表单的元素,大家都知道表单元素在各个浏览器中的表现不一,反正也是特别的丑,那么问题就来了,我们能自己设计表单元素的外观么?答案是可以的,现在我们就来试试吧.我们用两种方式来实现这一 ...

  9. javascript学习-原生javascript的小特效(原生javascript实现链式运动)

    以下代码就不详细解析了,在我之前的多个运动效果中已经解析好多次了,重复的地方这里就不说明了,有兴趣的童鞋可以去看看之前的文章<原生javascript的小特效> <!DOCTYPE ...

随机推荐

  1. IIS调优--增加并发处理能力

    一个ASP.NET项目在部署到生产环境时,当用户并发量达到200左右时,IIS出现了明显的请求排队现象,发送的请求都进入等待,无法及时响应,系统基本处于不可用状态.因经验不足,花了很多时间精力解决这个 ...

  2. SVN 从主干合并到分支库

    主干库:平时开发用的库, 分支库:中途需要进行上生产环境的库 分支库的版本从主干库拉过去就行 红色的为分支库. 创建的速度很快. 1.创建好后,在主干库添加一个文件. 2.然后分支库进行合并,这里用e ...

  3. MQTT研究之EMQ:【CoAP协议的ECC证书研究】

    今天研究的内容,是CoAP这个协议在EMQ消息队列的支持,CoAP是一个受限资源的协议,基于UDP实现的多用于物联网环境的通信协议.相关介绍不多说,可以看RFC. CoAP协议下,基于DTLS通信,同 ...

  4. Mac安装MySQL-python的血泪史

    现象描述 起初正常使用pip命令提示如下的错误: cc -bundle -undefined dynamic_lookup -Wl,-F. build/temp.macosx-10.14-intel- ...

  5. Flutter入门(二)

    * 网格布局 class HomeContent extends StatelessWidget { List<Widget> _getListData() { var tempList ...

  6. 简单工厂(二)——coding

    public abstract class Video { public abstract void produce(); } public class JavaVideo extends Video ...

  7. 【linux基础】如何配置ubuntu系统为静态IP地址

    前言 连接远程server重启的时候发现IP发生变化,影响远程连接,此时,需要将server配置为静态IP. 系统环境 ubuntu16.04 操作过程 1. 设置IP和DNS command sud ...

  8. 【转】解决深入学习PHP的瓶颈?

    转自:https://www.cnblogs.com/aksir/p/6774115.html PHP给学习者的感觉是:初学的时候很容易,但是学了2-3年,就深刻感觉遇到了瓶颈,很难深入,放弃又可惜. ...

  9. LinkedHashSet有没有重复的元素

      1.LinkedHashSet 的概述和使用 llinkedHashSet 的特点: 是唯一能保证怎么存就怎么输出的 set 集合,并且去重复 1 LinkedHashSet<String& ...

  10. Maven中dependencyManagement作用说明

    https://blog.csdn.net/helllochun/article/details/81564921 在Maven多模块的时候,管理依赖关系是非常重要的,各种依赖包冲突,查询问题起来非常 ...