通过原生js添加div和css
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的更多相关文章
- 原生js添加和删除类
原生js添加和删除类: this.className +=" "; this.className = this.className.replace(" 原来的类" ...
- 原生JS添加节点方法与jQuery添加节点方法的比较及总结
一.首先构建一个简单布局,来供下边讲解使用 1.HTML部分代码: <div id="div1">div1</div> <div id="d ...
- 原生js添加博客点击鼠标出小心心效果~~
昨天刚申请成功JS权限,心血来潮想添加点东西,记得之前看到别人家博客首页点击鼠标的时候会出现炫酷的 “小心心”,自己也来搞一个.没有用jquery啥的框架,原生js写起来麻烦了点,不过主要是怕博客首页 ...
- 原生js用div实现简单的轮播图
文章地址 https://www.cnblogs.com/sandraryan/ 原生js实现轮播图. 打开页面图片自动轮播,点击prev next按钮切换到上/下一张图片,点击1-5切换到对应图片. ...
- 原生JS添加类名 删除类名
为 <div> 元素添加 class: document.getElementById("myDIV").classList.add("mystyle&quo ...
- JS添加DOM元素CSS权重BUG
修改删除table的时候,比如拆分合并单元格,合并全部TR中的某个TD后在拆分还原,即使直接在td标签中设置了td的高宽属性,当td在css文件中设置为宽度auto的时候,不能显示出TD来,显示TD宽 ...
- 原生js添加类名,删除类名
1.添加类名: document.getElementById("myDiv").classList.add('mystyle'); 2.删除类名: document.getEle ...
- 使用原生JS 修改 DIV 属性
本例参考并改进自:https://www.jianshu.com/p/2961d9c317a3 大家可以一起学习!! <!DOCTYPE html> <html lang=" ...
- 原生JS添加事件方法
事件 事件添加方式 EvenTarget.addEventListener(EvenName, functionName, option); EventName: example => clic ...
随机推荐
- springmvc下使用kaptcha做验证码
http://www.open-open.com/lib/view/open1395238908947.html
- 由于无法创建应用程序域,因此未能执行请求。错误: 0x80070002 系统找不到指定的文件
前两天安装了一堆补丁后突然发现,原本正常使用了一年的应用系统打不开了,到事件日志中发现有.net framewok 2.0的补丁安装失败的日志,于从从重装补丁开始.到重新注册.net框架,再到所有.n ...
- p2p研究
p2p网络结构 中央集中式结构 无集中式非结构 混合式以超级节点结构 穿透原理 防火墙为克隆型(cone net),对称型(Symmetric NAT) 只有克隆型才能用打洞方式穿透 开源方案 htt ...
- smartjs 0.2 OOP讲解 - factory
本篇介绍OOP的第二个对象factory.在以往项目中其实真正使用klass的地方相当少,而factory则是十分常见的. 在smartjs中的factory并不是指的是工厂模式.在factory要求 ...
- Hql查询结果动态组装 List(map),List(bean),List(list),List(set)等格式(转)
1.//查询整个对象String hql="from Users";Query query = session.createQuery(hql);List<Users> ...
- 使用uploadify上传控件无法进入后台问题分析
分别在.net mvc 和java struts2中使用到 uploadify上传 文件,遇到同样的问题,选中文件上传后,文件无法上传,打上断点后发现没有进入后台. 逐步断点发现 项目共同点是加入了 ...
- Axure RP介绍
1.什么是原型设计?产品原型设计(Prototype Design)最基础的工作,就是结合批注.大量的说明以及流程图画框架图WireFrame,将自己的产品原型完整而准确的表述给 UI.UE.程序工程 ...
- Tools - RSS
RSS RSS是在线共享和阅读内容的一种方式,能够简洁高效地获取订阅内容的更新. 全称Really Simple Syndication (真正简易联合),也叫聚合内容. 有选择地浏览感兴趣的以及与工 ...
- 2014.7.12 敏捷个人奥森健步走&敏友分享会.活动报道
今天是个阳光明媚的日子,正式开起了敏捷个人2014年每月一次的健步走&读书分享活动. 周老师一大早8点就到了森林公园南门,一边看书一边等候敏友们的到来.时间走到了9点半,大家基本到齐了,我们准 ...
- 负载均衡服务器session共享的解决方案 (转载)
http://luanzhz.blog.163.com/blog/static/58023129201101811445262/ 在ASP.NET的程序中要使用Session对象时,必须确保页面的@p ...