关于loading

在开发中,不可避免的会需要loading的出现,来提高用户体验,

自己在查找中,总结了两条:

1、window.onload的时候显示loading,首先loading图片是一直存在的,window.onload函数是在加载完所有dom节点和图片等所有文件才调用的,

此时的情况就是,在加载的时候,loading图片一直存在,在调用window.onload函数的时候,改变loading的style样式,就ok了;

<div id="app">
<div class="load"><img src="img/g3.gif"/></div>
</div>
<script type="text/javascript">

window.onload=function(){
var load=document.getElementsByClassName(‘load‘)[0];
load.style.cssText =‘display:none;
}
</script>

2、第二种就是,在页面中,点击一下加载更多,此时,把loading图片显示,在callback回调函数里再把它隐藏就可以了。

时间: 2024-10-07 12:48:21

关于loading的相关文章

使用css3制作简单的loading效果

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <link rel="stylesheet" type="text/css" href="css/index.css"></head><b

Nginx 启动出错 error while loading shared libraries: libpcre.so.1

在 centos 6.5  64位上编译安装nginx1.63语法检查出错[root @localhost conf]# /usr/local/nginx/sbin/nginx -t /usr/local/nginx/sbin/nginx: error while loading shared libraries: libpcre.so.1: cannot open shared object file: No such file or directory 从错误看出是缺少lib文件导致,进一步

sqlplus: error while loading shared libraries解决方法

dbca建库后sqlplus提示如下 $ sqlplus / as sysdba sqlplus: error while loading shared libraries: /u01/app/oracle/product/11.2.0/dbhome_1/lib/libclntsh.so.11.1: cannot restore segment prot after reloc: Permission denied 解决方法 将selinux功能关掉 root用户 将/etc/selinux/c

Jquery Easy UI 实现页面的Loading效果(类似于Android的ProgressDialog)

前言 很常用的一种前端效果,比如当用户点击网页的某个按钮发送了一条异步请求,如果响应时间过长容易导致用户重复点击,一方面影响用户体验一方面容易造成不必要的服务端压力,Easy UI有现成的mask样式,简单封装一下就可以使用,之前查阅搜集了相关资料和文章,发现都介绍的都不是很完整,所以本篇blog就完整的记录一下通过Easy UI快速实现这种效果以及如何集成到项目中. 引入.封装和调用 首先当然是在我们的项目中集成jquery以及easyui的相关资源包,除了jquery的核心js文件,easy

JQuery图片加载显示loading和加载失败默认图片

在很多时候我们需要用到图片加载功能,在网上搜资料后就想为了以后使用方便重新整理了下,结果如图: 最后一张是加载失败显示的图片,没找到合适的图片,先用他顶替. 页面引用 <div class="container"> <div class="row block" id="img-list"> <div class="col-md-3"> <img src="/Assets/On

【CSS3】loading动画

HTML: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>loading</title> </head> <body> <div> <ul> <li></li> <li></li> <li><

[Angular Router] Lazy loading Module with Auxiliary router

Found the way to handle Auxiliary router for lazy loading moudle and erge load module are different. In Erge loading, it is recommended to create a shell component, inside shell component you need to define the router-outlet for each Auxiliary routes

微信小程序之----加载中提示框loading

loading loading只有一个属性hidden .wxml <view> <loading hidden="{{hidden}}"> 加载中... </loading> <button bindtap="changeHidden">show/hidden</button> </view> .js Page({ data:{ hidden:true }, changeHidden: fun

poj-2336 Ferry Loading II(dp)

题目链接: Ferry Loading II Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 3946   Accepted: 1985 Description Before bridges were common, ferries were used to transport cars across rivers. River ferries, unlike their larger cousins, run on a

eclipse启动无响应,停留在Loading workbench状态,或老是加载不了revert resources

做开发的同学们或多或少的都会遇到eclipse启动到一定程度时,就进入灰色无响应状态再也不动了.启动画面始终停留在Loading workbench状态.反复重启,状态依旧. 多数情况下,应该是非正常关闭eclipse工作区的文件状态错误所导致的. 在工作区目录中,有一个.metadata目录,里面是工作区及各插件的信息,删除此目录,再重启eclipse,果然可以正常启动eclipse了,但原来工作区的配置和项目信息也都消失,直接显示的是eclipse欢迎界面. 那么怎么做才能保证之前的配置不丢