function createStyle(){
return"*{padding:0;margin:0;border:0}.loading{width:640px;height:1024px;margin:0 auto}.loadImg{width:640px;height:1024px;animation:fadeInOut 3s linear;-webkit-animation:fadeInOut 3s linear;-moz-animation:fadeInOut 3s linear;opacity:0}@keyframes fadeInOut{0%{opacity:0}25%{opacity:.5}45%{opacity:1}50%{opacity:1}55%{opacity:1}75%{opacity:.5}100%{opacity:0}}@-moz-keyframes fadeInOut{0%{opacity:0}25%{opacity:.5}45%{opacity:1}50%{opacity:1}55%{opacity:1}75%{opacity:.5}100%{opacity:0}}@-webkit-keyframes fadeInOut{0%{opacity:0}25%{opacity:.5}45%{opacity:1}50%{opacity:1}55%{opacity:1}75%{opacity:.5}100%{opacity:0}}"
}
function addStyle(){
var style = document.createElement("style");
style.type = "text/css";
style.innerHTML = createStyle();
window.document.head.appendChild(style);
}
function addDom(){
var div = document.createElement("div");
div.className = "loading";
window.document.body.appendChild(div);
var img = document.createElement("img");
img.src="img/bg.png";
img.id="loadImg";
img.className="loadImg";
div.appendChild(img);
}
window.onload=function(){
addStyle();
addDom();
}

通过原生js添加div和css的更多相关文章

  1. 原生js添加和删除类

    原生js添加和删除类: this.className +=" "; this.className = this.className.replace(" 原来的类" ...

  2. 原生JS添加节点方法与jQuery添加节点方法的比较及总结

    一.首先构建一个简单布局,来供下边讲解使用 1.HTML部分代码: <div id="div1">div1</div> <div id="d ...

  3. 原生js添加博客点击鼠标出小心心效果~~

    昨天刚申请成功JS权限,心血来潮想添加点东西,记得之前看到别人家博客首页点击鼠标的时候会出现炫酷的 “小心心”,自己也来搞一个.没有用jquery啥的框架,原生js写起来麻烦了点,不过主要是怕博客首页 ...

  4. 原生js用div实现简单的轮播图

    文章地址 https://www.cnblogs.com/sandraryan/ 原生js实现轮播图. 打开页面图片自动轮播,点击prev next按钮切换到上/下一张图片,点击1-5切换到对应图片. ...

  5. 原生JS添加类名 删除类名

    为 <div> 元素添加 class: document.getElementById("myDIV").classList.add("mystyle&quo ...

  6. JS添加DOM元素CSS权重BUG

    修改删除table的时候,比如拆分合并单元格,合并全部TR中的某个TD后在拆分还原,即使直接在td标签中设置了td的高宽属性,当td在css文件中设置为宽度auto的时候,不能显示出TD来,显示TD宽 ...

  7. 原生js添加类名,删除类名

    1.添加类名: document.getElementById("myDiv").classList.add('mystyle'); 2.删除类名: document.getEle ...

  8. 使用原生JS 修改 DIV 属性

    本例参考并改进自:https://www.jianshu.com/p/2961d9c317a3 大家可以一起学习!! <!DOCTYPE html> <html lang=" ...

  9. 原生JS添加事件方法

    事件 事件添加方式 EvenTarget.addEventListener(EvenName, functionName, option); EventName: example => clic ...

随机推荐

  1. 关于Interface忽然想到的

    其实Interface,顾名思义,就是2个事物的"界面",interface衔接了2个事物,这两个事物,往往一方比较"多变",而另一方我们又不太希望它相对&qu ...

  2. 网络安装archlinux(2012.8.20)笔记

    周末闲极无聊,把烂笔记本翻出来想装个Archlinux,发现USB不能启动,光驱也挂了,只好网络安装. 我先后试了两种安装方式,一种纯互联网启动,安装,一种局域网启动,再互联网安装.分别说说. 不管哪 ...

  3. how to create a framework for ios . cool!

    预热. http://www.raywenderlich.com/65964/create-a-framework-for-ios http://insert.io/framework-ios8-xc ...

  4. 各种Camera,总有一款适合你(一)

    根据游戏类型的不一样,会需要各种各样的摄像机,下面将分享三种典型的摄像机类型:(1)地下城摄像机:(2)第三人称跟随摄像机:(3)鼠标控制旋转摄像机.将这些控制脚本拖动到场景的MainCamera上即 ...

  5. [Math] Beating the binary search algorithm – interpolation search, galloping search

    From: http://blog.jobbole.com/73517/ 二分检索是查找有序数组最简单然而最有效的算法之一.现在的问题是,更复杂的算法能不能做的更好?我们先看一下其他方法. 有些情况下 ...

  6. intellij 调试方法

    intellij 调试方法 转自 http://www.th7.cn/Program/net/201410/296492.shtml

  7. TOGAF培训讲义

    我作为国内首先进行TOGAF研究和实践的架构师之一,曾在中国软件技术大会和中国软件工程大会做过TOGAF相关的主题演讲,并在多家大中型企业做过企 业架构内训.这个是我在给需要企业架构的企业做内训时的讲 ...

  8. asp.net url重写相关技术问题整理

    1.IIS7配置URL重写需要注意系统是32位还是64位的 在IIS7配置URL重写的时候,需要添加“脚本映射”,如果是64位系统,会有两个地方存放.net framework分别是32位系统和64位 ...

  9. 关于WIndows内核自映射方案的通俗解释

    在一次操作系统课程上听老师说了这么一个有意思的东西,windows的自映射方案居然达到了把4K的页目录的线性地址“藏”在4M页表里的效果,感觉甚是奇特,于是乎就想着说怎么去算.光会算之后仍旧不满足,我 ...

  10. Spring MVC 配置文件dispatcher-servlet.xml 文件详解

    <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http://www.sp ...