慢工出细活 JS 等待加载效果
实例可以直接运行查看效果。很方便快捷
- <html>
- <head>
- <meta http-equiv="content-Type" content="text/html;charset=gb2312">
- <style type="text/css">
- <!--
- *{margin:0;padding:0;}
- .ifr_div{width:600px;height:600px; position:relative;}
- .ifr_div img{ vertical-align:middle;}
- .proccess{border:0px solid;border-color:#009900;height:600px;line-height:600px;width:600px;text-align:center;background:#eee;margin:0;position:absolute;top:0;left:0;}
- .proccess b{vertical-align:middle;background:url(http://ok22.org/upload/images/20110902143538381.gif) no-repeat 0 center;padding-left:35px;display:inline-block;}
- -->
- </style>
- </head>
- <body>
- <div class="ifr_div">
- <div class="proccess" id="loading"><b>正在加载中。。。</b></div>
- <iframe id="sfa" name="sfa" frameborder="0" scrolling="auto" height="600" width="600"></iframe>
- </div>
- <script language="JavaScript">
- var iframe = document.getElementById("sfa");
- iframe.src = "http://www.ok22.org";
- if (iframe.attachEvent){
- iframe.attachEvent("onload", function(){
- document.getElementById("loading").style.display="none";
- });
- } else { www.2cto.com
- iframe.onload = function(){
- document.getElementById("loading").style.display="none";
- };
- }
- </script>
- </body>
- </html>
慢工出细活 JS 等待加载效果的更多相关文章
- js图片加载效果（延迟加载+瀑布流加载）
概述 两种图片加载的效果:一种是遇到图片较多时,带读条效果的加载提示:另一种是根据滑块的位置进行预加载,用户不察觉的情况下,实现瀑布流的加载效果 详细 代码下载:http://www.demodash ...
- [js开源组件开发]loading加载效果
loading加载效果 由于程序和网络的原因,常常我们需要在交互的时候,给用户一个正在加载中的动画,于是,loading组件横空出世.不需要复杂的代码,也能完成大多数业务,这就是我做组件的原则. 效果 ...
- js 实现加载百分比效果
效果: html: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> < ...
- 使用 SVG 实现一个漂亮的页面预加载效果
今天我们要为您展示如何使用 CSS 动画, SVG 和 JavaScript 创建一个简单的页面预加载效果.对于网站来说,这些预载入得画面提供了一种创造性的方法,使用户在等待内容加载的时候不会那么无聊 ...
- 转:web前端面试题合集 (Javascript相关)（js异步加载详解）
1. HTTP协议的状态消息都有哪些? 1**:请求收到,继续处理2**:操作成功收到,分析.接受3**:完成此请求必须进一步处理4**:请求包含一个错误语法或不能完成5**:服务器执行一个完全有效请 ...
- js文件加载优化
在js引擎部分,我们可以了解到,当渲染引擎解析到script标签时,会将控制权给JS引擎,如果script加载的是外部资源,则需要等待下载完后才能执行. 所以,在这里,我们可以对其进行很多优化工作. ...
- 再唠叨JS模块化加载之CommonJS、AMD、CMD、ES6
Javascript模块化编程,已经成为一个迫切的需求.理想情况下,开发者只需要实现核心的业务逻辑,其他都可以加载别人已经写好的模块. Javascript社区做了很多努力,在现有的运行环境中,实现” ...
- 如何在小程序实现图片lazy-load懒加载效果
自从跳一跳出现之后小程序又开始频繁出现了,在学习过程中发现小程序虽然好但是由于api不完善导致开发过程中有很多的坑,重点是网上相对小程序出现坑时解决方案显然比较少,小程序最让人觉得痛心疾首之一就是无法 ...
- js玩命加载……
在请求数据加载的过程中,经常需要显示请求等待,写了一个简单的请求等待—- html代码如下 <!--页面载入显示--> <div id="dataLoad" st ...
随机推荐
- Python Semaphore
Semaphore信号量的使用 信号量: 互斥锁 同时只允许一个线程更改数据,而Semaphore是同时允许一定数量的线程更改数据 ,比如厕所有3个坑,那最多只允许3个人上厕所,后面的人只能等里面有人 ...
- Linux 默认线程栈大小 调优
Linux 线程栈介绍 栈,就是那些由编译器在需要的时候分配,在不需要的时候自动清除的变量的存储区.里面的变量通常是局部变量.函数参数等:和堆相比,栈通常很小. Linux 查询线程栈 1.查看默认的 ...
- bzoj 1835 base 基站选址 - 动态规划 - 线段树
题目传送门 需要高级权限的传送门 题目大意 有$n$个村庄坐落在一条直线上,第$i \ \ \ (i>1)$个村庄距离第$1$个村庄的距离为$D_i$.需要在这些村庄中建立不超过$K$个通讯基站 ...
- ERROR 1666 (HY000): Cannot execute statement: impossible to write to binary log since statement is in row format and BINLOG_FORMAT = STATEMENT.
centos7.5 binlog恢复数据失败 问题: mysql> \. /tmp/inc.sql ERROR 1050 (42S01): Table 'new_1' already exist ...
- iOS开发 -------- storyBoard实现控制器添加childViewController
1 拖进去scrollView 添加约束(0,0,0,0); 2 更新scrollView约束,然后在scrollView上面加个view,设置其约束为(0,0,0,0) 和 水平滑动约束; ...
- 论文笔记：Dynamic Multimodal Instance Segmentation Guided by Natural Language Queries
Dynamic Multimodal Instance Segmentation Guided by Natural Language Queries 2018-09-18 09:58:50 Pape ...
- IdentityServer4授权类型(GrantType)对应的返回类型(ResponseType)
授权类型(GrantyType) 返回类型(ResponseType) authorization_code code implicit token implicit id_token implici ...
- 【IOS】#import和#include有什么区别，@class呢，#import<>跟#import ""有什么区别？
1.#import是object-c导入头文件的关键字,#include是C/c++导入头文件的关键字,使用#import导入头文件会自动只导入一次,不会重复导入. 2.@class是告诉编译器某个类 ...
- Cocos Creator 使用protobufjs
Win7 + Creator 2.0.0 + protobufjs 6.8.8 1.下载安装protobufjs npm install -g protobufjs 可以看到protobufjs安装在 ...
- [Hibernate] inner Join和 left Join
@Test public void test11(){ Session ss=HibernateUtil.getSession(); //根据员工名称(SCOTT)找到和他所在的部门的其他员工的信息 ...