Ajax风格的一款网页Loading效果
现在比较流行的一款Ajax风格的网页Loading,多见于一些大量使用Ajax技术的网站中,页面加载时会自动显示提示信息,带载入动画效果,网页加载完自动消失,是一款正在具有Loading功能的网页进度条。
Loading
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;}
document.write('
页面加载中,请稍候……
');
window.onload = function(){
document.getElementById('loadbox').style.display="none";
document.getElementById('content').style.display="block";
}
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
相关推荐
-
dwz 如何去掉ajaxloading具体代码
最近使用dwz来做项目,有时候在ajax的时候并不想使用dwz的loading. 所以就像去掉,很简单,只需要一行代码: 复制代码 代码如下: $.ajaxSettings.global=false; 将这行 代码加在ajax的前面就行了:下面是我的代码 复制代码 代码如下: $.ajaxSettings.global=false; $.getJSON(show.conf.url, show.conf.data, function(d) { });
-
javascript模拟实现ajax加载框实例
本文实例讲述了javascript模拟实现ajax加载框的方法,分享给大家供大家参考.具体方法如下: 复制代码 代码如下: function loading(p_value,str) { if (p_value) { if (!document.getElementById("load_area")) { var para1 = document.createElement("span"); var node=document.createTextNode(str)
-
Ajax全局加载框(Loading效果)的配置
在Ajax进行后台数据请求的过程中,我们有时候会希望用户能知道页面后台还在做一些事情,这时候就需要给用户一个非常明确的提示,也就是我们所谓的进度条 实现原理: Jquery可以对ajax进行全局的设置,实现类似于C#中面向切面的效果,即对在Ajax提交之前和提交完成之后,我们均可以对其进行一系列的操作,所以我们可以在ajax开始的时候,把Loading框显示出来,在ajax请求完成之后,把loading框关闭掉,基本上就完美实现这个效果了. Jquery全局配置Ajax的方式为: $.ajaxS
-
Ajax loading gif generator
http://ajaxload.info/ 生成loader动画一个网站
-
JS基于Ajax实现的网页Loading效果代码
本文实例讲述了JS基于Ajax实现的网页Loading效果代码.分享给大家供大家参考,具体如下: 这是一款很不错的网页Loading效果,常用于Ajax交互式网页设计中,点击按钮即可弹出Loading框,若Loading框未加载完成时关闭网页,会弹出确认提示框,用于一些对安全性能要求高的网页交互处理中,比如付款操作. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-ajax-web-loading-style-codes/ 具体代码如下:
-
Ajax风格的一款网页Loading效果
现在比较流行的一款Ajax风格的网页Loading,多见于一些大量使用Ajax技术的网站中,页面加载时会自动显示提示信息,带载入动画效果,网页加载完自动消失,是一款正在具有Loading功能的网页进度条. Loading body{background-color:#000;} #content{display:none;} #loadbox{position:absolute;top:50%;left:50%;margin-left:-68px;margin-top:-36px;width:2
-
vue实现ajax滚动下拉加载,同时具有loading效果(推荐)
代码如下所示: <!doctype html> <html> <head> <meta charset="utf-8"> <title>vue测试ajax的使用</title> <meta id="viewport" name="viewport" content="width=device-width, initial-scale=1.0, minimum-
-
JS实现自动定时切换的简洁网页选项卡效果
本文实例讲述了JS实现自动定时切换的简洁网页选项卡效果.分享给大家供大家参考.具体如下: 这是一款简洁人网页选项卡,与其它TAB不同的是,本选项卡是自动切换的,在变量里设定选项卡的内容.切换时间等,它就开始工作了,如果可以响应鼠标的动作就更完美了. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-auto-ds-web-menu-demo/ 具体代码如下: <html> <head> <title>自动切换的选项卡
-
JavaScript+CSS实现仿天猫侧边网页菜单效果
本文实例讲述了JavaScript+CSS实现仿天猫侧边网页菜单效果.分享给大家供大家参考.具体如下: 这是一款自己写的仿天猫的菜单效果,二级分类的功能已经实现,但没有美化,留着用的朋友自己完善吧,JS功能已经实现,鼠标移在主分类上,二级分类向右伸出展开,目前淘宝网.天猫购物.京东都在用的导航菜单特效,测试时候请先点击一下菜单,主菜单就显示出来了. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-css-ftamil-web-menu-st
-
JS实现完全语义化的网页选项卡效果代码
本文实例讲述了JS实现完全语义化的网页选项卡效果代码.分享给大家供大家参考.具体如下: 这是一款完全语义化的JS网页选项卡,包括了两种用法,一种是点击式,另一种是滑动门式,具体用哪一种要根据你自己的需要了,滑动门是在鼠标经过时触发,选项卡则是需要鼠标点击的. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-yyh-web-tab-cha-nav-codes/ 具体代码如下: <!DOCTYPE html PUBLIC "-//W3C/
-
jQuery+Ajax+PHP弹出层异步登录效果(附源码下载)
弹出层主要用于展示丰富的页面信息,还有一个更好的应用是弹出表单层丰富交互应用.常见的应用有弹出登录表单层,用户提交登录信息,后台验证登录成功后,弹出层消失,主页面局部刷新用户信息.本文我们将给大家介绍如何使用jQuery+Ajax+PHP弹出层异步登录的应用. 效果展示 源码下载 HTML 由于本例UI部分使用了Bootstrap,以及使用jQuery插件,因此需要事先载入相关文件,推荐大家使用相关的CDN资源. <link rel="stylesheet" hre
-
jquery+CSS实现的水平布局多级网页菜单效果
本文实例讲述了jquery+CSS实现的水平布局多级网页菜单效果.分享给大家供大家参考.具体如下: 这里演示的Jquery和CSS共同实现的网页常见的导航菜单,支持两级形式,蓝色风格,最多支持二级,三级可能要对代码进行改造了.本菜单属于中规中矩型,实用性比较强,适合的网站种类也是很多的,希望大家会喜欢. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/jquery-css-scroll-nav-menu-style-codes/ 具体代码如下:
-
jquery实现清新实用的网页菜单效果
本文实例讲述了jquery实现清新实用的网页菜单效果.分享给大家供大家参考.具体如下: 这是一款应用了jQuery插件来实现的网页菜单,看上去十分清新实用,来自美国Flickr网站,不知道Flickr网站的朋友自己去查.这款菜单在用户点击了主菜单项的时候,会滑出二级的子菜单,菜单前边带有小图标,增加了人性化体验. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/jquery-plug-web-menu-codes/ 具体代码如下: <!DOCTY
随机推荐
- Linux 下的五种 IO 模型详细介绍
- Docker-compose的安装和设定详细步骤
- JS 如果改变span标签的是否隐藏属性
- js拼接html注意问题示例探讨
- 浅析c++ 宏 #val 在unicode下的使用
- php使用APC实现实时上传进度条功能
- 详解JavaScript函数
- Java程序中添加播放MIDI音乐功能的实现方法详解
- nginx+iis实现简单的负载均衡
- python使用reportlab实现图片转换成pdf的方法
- SQL触发器实例讲解
- 基于jQuery的合并表格中相同文本的相邻单元格的代码
- jquery实现红色竖向多级向右展开的导航菜单效果
- 浅析jQuery Mobile的初始化事件
- DedeCMS v5.1 首页幻灯显示不正常的解决方法
- 多个java泛型示例分享
- java书店系统毕业设计 用户模块(3)
- C#实现洗牌游戏实例
- Android 判断SIM卡属于哪个移动运营商详解及实例
- c# 获取字符串的字节数的方法