现在比较流行的一款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效果的更多相关文章

  1. php+ajax实现登录按钮加载loading效果

    php+ajax实现登录按钮加载loading效果,一个提高用户体验,二个避免重复提交表单,ajax判断加载是否完成. 登录表单 <form onsubmit="return chec ...

  2. 网页Loading效果

    问题描述:由于项目要求在页面提交以及加载的时候,有短暂的卡顿,需要用loading过渡. 1.下一个页面加载的时候实现: base-loading.js //获取浏览器页面可见高度和宽度 var _P ...

  3. vue实现ajax滚动下拉加载，同时具有loading效果

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  4. JQuery+CSS3实现Ajax加载时loading效果

    之前通过Ajax请求加载数据的时候,在数据还没有呈现出来前,为了更好的用户体验,总会弄个loading告诉用户其实内容正在加载,而不是网站崩了.但是貌似之前使用gif图片的情况比较多,可能是为了兼容各 ...

  5. 自定义ajax,添加loading效果

    自定义ajax /** * @desc 自定义ajax请求,添加等待gif */ var n=0; $.defineAjax=function(obj){ n++; if(!$('#loadingDi ...

  6. Ajax全局加载框(Loading效果)的配置

    在Ajax进行后台数据请求的过程中,我们有时候会希望用户能知道页面后台还在做一些事情,这时候就需要给用户一个非常明确的提示,也就是我们所谓的进度条 废话完成~ 实现原理: Jquery可以对ajax进 ...

  7. AS3.0纯代码编写的两款loading效果

    AS3.0纯代码编写的两款loading效果 效果一 效果二 代码很简单,实现的原理一样,只不过矩形用到了Matrix类,对注册点进行了调整,效果可用于视频播放器缓冲时的loading效果,下面看代码 ...

  8. ajax加载菊花loading效果

    Ajax异步请求的时候,一般都会利用一个动态的gif小图片来制作一个Ajax Loading,以便增加用户体验. 这里我们可以使用Spin.js,该js脚本压缩后5k,可以不用任何图片,任何外部CSS ...

  9. CSS3 loading效果全

    梦想天空 关注前端开发技术 ◆ 推动 HTML5 & CSS3 技术发展 ◆ 本博客全新站点:yyyweb.com 欢迎围观:) 首页 管理 订阅 网页设计 JavaScript jQuery ...

随机推荐

  1. 第六章 类型(class)和成员基础

    1. 概述 本章讲述如何在一个类型中定义不同种类的成员. 2. 名词解释 3. 主要内容 3.1 类型的各种成员 在一个类型中,可以定义0个或多个以下种类的成员: ① 常量:常量就是指出数据值恒定不变 ...

  2. swoole 异步队列

    安装步骤如下(推荐把安装文件下载到 /usr/local/src 目录下): step 1: wget --no-check-certificate https://github.com/swoole ...

  3. windows phone 豆瓣api的封装

    利用周末的时候,重新封装一下豆瓣的api,就当是练手吧!其实现在网上好用的api很多,在这个demo里面基本上已经将整体框架搭建起来,本来想继续完善下去的.但是其实accesstoken的时候,一直拿 ...

  4. WebClient和HttpReuqest两种网络请求的方式

    相对来说webClient请求的方式比较简单,可以直接通过new的方式创建一个实例,然后调用OpenReadAsync方法传进一个url,最后通过回调函数OpenReadCompleted就可以获取网 ...

  5. 15个最好的Bootstrap设计工具推荐

    摘要:Bootstrap不单单是一个框架,更确切的说,它改变了整个游戏规则.该框架使得许多应用和网站的设计开发变得简便许多,而且它将大量的HTML框架普及成了产品. Bootstrap是由前Twitt ...

  6. http压力测试

    一.http_load程序非常小,解压后也不到100Khttp_load以并行复用的方式运行,用以测试web服务器的吞吐量与负载.但是它不同于大多数压力测试工具,它可以以一个单一的进程运行,一般不会把 ...

  7. [转]ubuntu错误解决E: Sub-process /usr/bin/dpkg returned an error code (1)

    [转]ubuntu错误解决E: Sub-process /usr/bin/dpkg returned an error code (1) http://yanue.net/post-123.html ...

  8. [读行者][学习LinqExpression和Reflection(Emit)]阅读TypeBuilderSample之ExampleFromTheArticle

    前言 关于”读行者“ 俗语有云:"读万卷书,行万里路“.多读一些优秀代码,不仅可以锻炼我们读代码的能力(便于维护或相互交流),还可以吸取很多我们成长所需的知识点.多读,才能开阔我们的眼界,才 ...

  9. forword属性

    forword属性 2013年7月8日 15:07 Name: Forward的名字,与mapping.findForward方法传入的值相同. Path: 请求转发的页面路径 Redirect: 请 ...

  10. html a 链接

    1.链接元素 文本.图像.热区 2.标记 描述性文字 target窗口形式 _self:在自身窗口打开(默认) _blank:在新窗口打开 _parent:在父窗口打开 _top:在顶窗口打开 框架或 ...