jquery预加载显示百分比
jquery预加载显示百分比
<pre>
<img class="bj loadimg" loadimg="/weiqingshu/images/1/bj.jpg"/>
</pre>
<script type="text/javascript" src="/caigeci/js/jquery.imgpreload.min.js"></script>
<pre>
imgNum=0;
var load_img = [];
/*$('.loadimg').each(function () {
var loadimg=$(this).attr('loadimg');
load_img.push(loadimg);
})*/
load_img.push( '/caigeci/images/answer0.jpg' );
load_img.push( '/caigeci/images/answer1.jpg' );
/*ss*/
jQuery.imgpreload(load_img, {
each: function () {
/*this will be called after each image loaded*/
var status = $(this).data('loaded') ? 'success' : 'error';
if (status == "success") {
var v = (parseFloat(++imgNum) / load_img.length).toFixed(2);
console.log(Math.round(v * 100) + "<sup>%</sup>");
}
},
all: function() {
console.log('全部加载完成');
/*$('.loadimg').each(function () {
var loadimg=$(this).attr('loadimg');
$(this).attr('src',loadimg);
})*/
}
});
</pre>
ps:加载的文件个数 /全部文件个数 的百分比就是进度
jquery预加载显示百分比的更多相关文章
- jQuery预加载插件
插件描述:jQuery Fadeloader的插件可以让你轻松实现预加载到您的网站或部分使用级联渐显效果来显示特定的内容块(例如,头> MENU>内容>页脚) jQuery Fa ...
- jquery预加载的几种方式
实际编写前端页面时,有时候希望一打开某个页面就加载一些方法.下面是4种预加载方法. ①页面加载完之前执行,与嵌入的js加载方式一样(写jquery插件的时候使用) (function ($) { al ...
- jquery预加载的几种例子
实际编写前端页面时,有时候希望一打开某个页面就加载一些方法.下面是4种预加载方法. ①页面加载完之前执行,与嵌入的js加载方式一样(写jquery插件的时候使用) (function ($) { al ...
- JQuery图片加载显示loading和加载失败默认图片
在很多时候我们需要用到图片加载功能,在网上搜资料后就想为了以后使用方便重新整理了下,结果如图: 最后一张是加载失败显示的图片,没找到合适的图片,先用他顶替. 页面引用 <div class=&q ...
- FragmentPagerAdapter加载fragment并使用setUserVisibleHint()处理预加载时遇到的坑,给textview赋值时出现的空指针异常
FragmentPagerAdapter加载fragment并使用setUserVisibleHint()处理预加载时,给textview赋值时出现的空指针异常 public class BaseFr ...
- jquery.imgpreload.min.js插件实现页面图片预加载
页面分享地址: http://wenku.baidu.com/link?url=_-G8miwbgDmEj6miyFtjit1duJggBCJmFjR2jky_G1VftD9eS9kwGOlFWAOR ...
- jquery实现图片预加载
使用jquery实现图片预加载提高页面加载速度和用户体,本就为大家详细分析jquery图片预加载的实现原理. 什么时候使用图片预加载? 如果页面使用了很多不是最初加载便可见的图片,有必要进行预加载: ...
- jQuery实现图片预加载提高页面加载速度和用户体验
我们在做网站的时候经常会遇到这样的问题:一个页面有大量的图片导致页面加载速度缓慢,经常会出现一个白页用户体验很不好.那么如何解决这个问题呢?首先我们会想到的是提高服务器性能,使用静态缓存等手段来加快图 ...
- 转载:用Jquery实现的图片预加载技术,可以实现有序加载和无序加载!
一.背景 我们在做页面的时候,从用户体验的角度出发,肯定是希望用户以最快的速度看到完整的页面信息,但在实际情况中经常会遇到些问题. 比如受网速影响,页面加载素材的时间比较长,页面会出现短时间的错乱或者 ...
随机推荐
- C++编译器与链接器工作原理
http://blog.csdn.net/success041000/article/details/6714195 1. 几个概念 1)编译:把源文件中的源代码翻译成机器语言,保存到目标文件中.如果 ...
- three arrays HDU - 6625 (字典树)
three arrays \[ Time Limit: 2500 ms \quad Memory Limit: 262144 kB \] 题意 给出 \(a\),\(b\) 数组,定义数组 \(c[i ...
- K-string HDU - 4641 (后缀自动机)
K-string \[ Time Limit: 2000 ms\quad Memory Limit: 131072 kB \] 题意 给出长度为 \(n\) 的字符串,接下来跟着 \(m\) 次操作, ...
- CCF 201709-3 JSON查询
CCF 201709-3 JSON查询 试题编号: 201709-3 试题名称: JSON查询 时间限制: 1.0s 内存限制: 256.0MB 问题描述: 问题描述 JSON (JavaScript ...
- luogu P3327 [SDOI2015]约数个数和 莫比乌斯反演
题面 我的做法基于以下两个公式: \[[n=1]=\sum_{d|n}\mu(d)\] \[\sigma_0(i*j)=\sum_{x|i}\sum_{y|j}[gcd(x,y)=1]\] 其中\(\ ...
- Android编程权威指南笔记
学习android开发,你需要对java语言,包括类,对象,接口,监听器,包,内部类,匿名内部类有所了解. android studio 的下载与安装 可以从android开发者网站下载android ...
- MSSQL随机修改时间
GO DECLARE @BDate datetime, @EDate datetime SET @BDate = '20190801' --上限 SET @EDate = '20190819 23:5 ...
- layui上传文件组件(前后端代码实现)
我个人博客系统上传特色图片功能就是用layui上传文件组件做的.另外采用某个生态框架,尽量都统一用该生态框架对应的解决方案,因为这样一来,有这么几个好处?1.统一而不杂糅,有利于制定相应的编码规范,方 ...
- java基础之 内部类 & 嵌套类
参考文档: 内部类的应用场景 http://blog.csdn.net/hivon/article/details/606312 http://wwty.iteye.com/blog/338628 定 ...
- Linux上tomcat部署web项目,访问报错"ip访问时间过长"
项目原来是可以访问的,后来突然不能不访问了,系统ip也是能ping通的,后来就想是不是防火墙的问题,查看一下还真是 原因:Linux服务器上的防火墙开着,关闭即可 1.查看firewall服务状态 s ...