<!DOCTYPE html>

<html>

<head>

<title>css实现页面加载中,请稍候效果</title>

<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">

<meta http-equiv="description" content="this is my page">

<meta http-equiv="content-type" content="text/html; charset=UTF-8">

</head>

<body>

    <div id="loadPage"

        style="display:none;position:absolute; left:-1px; top:1px; width:100%; height:100%;moz-opacity: 0.3;filter:Alpha(opacity=50); opacity: 0.3; background-color:#555; z-index:1000;">

        <img src="./images/06.gif" style="position: fixed;left: 48%;top:35%;"></img>

    </div>

</body>

</html>

默认是隐藏的，可通过js控制div的显示和隐藏，背景颜色和图片可自行调节。

css 实现页面加载中等待效果的更多相关文章

  1. 利用document的readyState去实现页面加载中的效果

    打开新的网页时,为了增强友好性体验,告知用户网页正在加载数据需要呈现一个"页面加载中"之类的提示,只需要利用document就可以实现. 实现示例代码如下: <style&g ...

  2. css实现加载中的效果

    那天闲着,学习了一下样式效果,自己实现了一个简单的加载中的效果 废话不多说,开始吧!! 一.实现一个圆环       要实现圆环,首先我们需要知道盒模型里面border的本质,先来看一个效果吧 从上面 ...

  3. 微信小程序：添加全局的正在加载中图标效果

    在发送请求的时候,显示一个正在加载中的小图标.在加载下一页的时候也显示正在加载中.同时数据请求回来了,把加载中进行关闭. 开发----API-----界面 在哪里添加这两段代码会比较方便呢?一个项目有 ...

  4. 页面加载时loading效果

    页面加载时loading效果: <!DOCTYPE html> <html lang="en"> <head> <meta charset ...

  5. 页面加载中jquery逐渐消失效果实现

    为了获得更好的用户体验,现在大多数网页都会在页面中加一个加载中效果,这里实现一个加载中逐渐消失的效果,以至于看上去不那么生硬. html: <div id="loading" ...

  6. css3 linear-gradient实现页面加载进度条效果

    最终效果图: html结构: <div>    <p class="p1">        <span></span>    < ...

  7. 利用css实现页面加载时旋转动画

    有时浏览一些网站时在刚加载页面时候会出现一个滚动动画如下图,特别是对于一些移动端的站点或者混合应用来说应该用户体验会好很多,扒了下页面发现是用css样式控制的,于是把页面以及css样式赋值了下来, h ...

  8. ajax 异步加载显示等待效果

    css: #loading { width:170px; height:25px; border:3px solid #C3DAF9; position:absolute; top:300px; le ...

  9. Android 三种方式实现自定义圆形页面加载中效果的进度条

    转载:http://www.eoeandroid.com/forum.php?mod=viewthread&tid=76872 一.通过动画实现 定义res/anim/loading.xml如 ...

随机推荐

  1. bzoj AC 50 庆祝～～

    No. 1050 Solved 50 Submit 212 AC 60 PE 6 WA 88 TLE 13 MLE 5 OLE 2 RE 29 CE 9 10001002100310041005 10 ...

  2. Codeforces Round #154 (Div. 2) : B

    一个很简单的题: 方法一: 二分. 代码: #include<cstdio> #include<algorithm> #define maxn 100005 using nam ...

  3. 修炼debug

    常用方法: alert console.log 行号手工打breakpoints 手工加入debugger:配合条件if(){debugger;} break on dom modify eventL ...

  4. Android 正则表达式匹配汉字中文

    关于中文的正则表达式, 应该是^[\\u4E00-\\u9FFF]+$, 和论坛里常被人提起的^[\\u4E00-\\u9FA5]+$很接近需要注意的是论坛里说的^[\\u4E00-\\u9FA5]+ ...

  5. oracle 安装, oem 不能正常使用，em安装失败、找不到dbconsole服务

    OracleDBControl启动失败Unable to determine local host from URL REPOSITORY_URL=http://your-url.co 通过emca创 ...

  6. bzoj1391

    很像最大权闭合子图的题目s向每个工作连边,流量为收益每个工序,由工作i向对应机器连边,流量为租用费每个机器向t连边,流量为购买费显然跑最小割,ans=总收益-mincut ; type node=re ...

  7. SQL Server 中各个系统表的作用

    来源:http://www.hoky.org/blog/ sysaltfiles 主数据库 保存数据库的文件syscharsets 主数据库 字符集与排序顺序sysconfigures 主数据库 配置 ...

  8. 【转】实现展开列ExpandableListView的三种方式之SimpleExpandableListAdapter实例

    原文网址:http://blog.csdn.net/x605940745/article/details/12099709 实现可扩展展开列ExpandableListView的三种方式 欢迎加入QQ ...

  9. Win32中常用消息

    一 .WM_PAINT消息 1 WM_PAINT的产生   由于窗口的互相覆盖等,产生需要绘制的区域,那么会产生WM_PAINT消息. 一般情况下,不直接发送WM_PAINT消息,通过API声明需要绘 ...

  10. ubuntu下使用ngrok外网映射

    好久之前想搞明白这个事情,可是就是不知道这个词叫外网映射,所以也一直不知怎么做,在慕课网看用java开发微信公众号的时候教程里提到了外网映射,查了一些资料终于把本地给映射到外网了,直接变成了80端口, ...