Ajax风格的一款网页Loading效果
现在比较流行的一款Ajax风格的网页Loading,多见于一些大量使用Ajax技术的网站中,页面加载时会自动显示提示信息,带载入动画效果,网页加载完自动消失,是一款正在具有Loading功能的网页进度条。
<html></P>
<P><head>
<title>Loading</title>
<style type="text/css">
body{background-color:#000;}
#content{display:none;}
#loadbox{position:absolute;top:50%;left:50%;margin-left:-68px;margin-top:-36px;width:222px;height:58px;text-align:center;}
#loadbox span{display:block;width:222px;height:32px;text-align:center;color:#CCC;font-size:9pt;}
</style>
<script type="text/javascript">
document.write('<div id="loadbox"><span>页面加载中,请稍候……</span><img src="/jscss/demoimg/200907/loading.gif" border="0"></div>');
window.onload = function(){
document.getElementById('loadbox').style.display="none";
document.getElementById('content').style.display="block";
}
</script>
</head>
<body>
<div id="content"><iframe src="#" width="800" height="360" marginwidth="0" marginheight="0" hspace="0" vspace="0" frameborder="0" scrolling="no"></iframe></div>
</body>
</html>
Ajax风格的一款网页Loading效果的更多相关文章
- php+ajax实现登录按钮加载loading效果
php+ajax实现登录按钮加载loading效果,一个提高用户体验,二个避免重复提交表单,ajax判断加载是否完成. 登录表单 <form onsubmit="return chec ...
- 网页Loading效果
问题描述:由于项目要求在页面提交以及加载的时候,有短暂的卡顿,需要用loading过渡. 1.下一个页面加载的时候实现: base-loading.js //获取浏览器页面可见高度和宽度 var _P ...
- vue实现ajax滚动下拉加载,同时具有loading效果
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- JQuery+CSS3实现Ajax加载时loading效果
之前通过Ajax请求加载数据的时候,在数据还没有呈现出来前,为了更好的用户体验,总会弄个loading告诉用户其实内容正在加载,而不是网站崩了.但是貌似之前使用gif图片的情况比较多,可能是为了兼容各 ...
- 自定义ajax,添加loading效果
自定义ajax /** * @desc 自定义ajax请求,添加等待gif */ var n=0; $.defineAjax=function(obj){ n++; if(!$('#loadingDi ...
- Ajax全局加载框(Loading效果)的配置
在Ajax进行后台数据请求的过程中,我们有时候会希望用户能知道页面后台还在做一些事情,这时候就需要给用户一个非常明确的提示,也就是我们所谓的进度条 废话完成~ 实现原理: Jquery可以对ajax进 ...
- AS3.0纯代码编写的两款loading效果
AS3.0纯代码编写的两款loading效果 效果一 效果二 代码很简单,实现的原理一样,只不过矩形用到了Matrix类,对注册点进行了调整,效果可用于视频播放器缓冲时的loading效果,下面看代码 ...
- ajax加载菊花loading效果
Ajax异步请求的时候,一般都会利用一个动态的gif小图片来制作一个Ajax Loading,以便增加用户体验. 这里我们可以使用Spin.js,该js脚本压缩后5k,可以不用任何图片,任何外部CSS ...
- CSS3 loading效果全
梦想天空 关注前端开发技术 ◆ 推动 HTML5 & CSS3 技术发展 ◆ 本博客全新站点:yyyweb.com 欢迎围观:) 首页 管理 订阅 网页设计 JavaScript jQuery ...
随机推荐
- 清空FORM表单的几种方式 Reset 重加载
1. form中定义name <form name = "sbform" action="sb_add.php" method="post&qu ...
- 获取月份对应的day
function getDaysInMonth(month, year) { , , , , , , , , , , , ]; //主要处理二月份的天数 ) && (year % == ...
- GetType() 和typeof() 的区别
GetType() 非强类型,支持跨程序集发射,用来支持动态引用, A obja=new A(); Type t=obja.GetType() typeof() 强类型,静态的 Type t=type ...
- ThinkPHP 3.2.2跨控制器调用方法
所谓跨控制器调用,指的是在一个控制器中调用另一个控制器的某个方法.在ThinkPHP中有三种方式实现跨控制器调用: 直接实例化: A()函数实例化; R()函数实例化. (1)直接实例化 直接实例 ...
- DB2物化表
DB2物化查询表(MQT)是DB2数据库中一类特殊的表 物化表和视图的区别 物化表是一个查询结果集,视图是一个SQL语句. 以下是一个简单例子(说明物化表) 1.创建表,插入测试数据 ----创建表 ...
- linux kernel 0.11 bootsect
bootsect作用 ①将自己移动到0x90000处 ②将setup从磁盘读到0x90200处 ③将system从磁盘读到0x10000处 寄存器 汇编代码中存在:数据段data seg 栈段 sta ...
- jdbc 连接 oracle rac
jdbc 连接 oracle rac 的连接串如下: jdbc:oracle:thin:@(DESCRIPTION =(ADDRESS = (PROTOCOL = TCP)(HOST = 192. ...
- PHY
Linux 下smi/mdio总线通信 韩大卫@吉林师范大学 下面代码描述了在用户层访问smi/mdio总线, 读写phy芯片寄存器的通用代码.Linux内核2.6以上通用. 将下面代码编译后,将可执 ...
- python中的各种排序
#encoding=utf-8 import random from copy import copy def directInsertSort(seq): """ 直接 ...
- 网络爬虫by pluskid
网络爬虫(Web Crawler, Spider)就是一个在网络上乱爬的机器人.当然它通常并不是一个实体的机器人,因为网络本身也是虚拟的东西,所以这个“机器人”其实也就是一段程序,并且它也不是乱爬,而 ...