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预加载显示百分比的更多相关文章

  1. jQuery预加载插件

      插件描述:jQuery Fadeloader的插件可以让你轻松实现预加载到您的网站或部分使用级联渐显效果来显示特定的内容块(例如,头> MENU>内容>页脚) jQuery Fa ...

  2. jquery预加载的几种方式

    实际编写前端页面时,有时候希望一打开某个页面就加载一些方法.下面是4种预加载方法. ①页面加载完之前执行,与嵌入的js加载方式一样(写jquery插件的时候使用) (function ($) { al ...

  3. jquery预加载的几种例子

    实际编写前端页面时,有时候希望一打开某个页面就加载一些方法.下面是4种预加载方法. ①页面加载完之前执行,与嵌入的js加载方式一样(写jquery插件的时候使用) (function ($) { al ...

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

    在很多时候我们需要用到图片加载功能,在网上搜资料后就想为了以后使用方便重新整理了下,结果如图: 最后一张是加载失败显示的图片,没找到合适的图片,先用他顶替. 页面引用 <div class=&q ...

  5. FragmentPagerAdapter加载fragment并使用setUserVisibleHint()处理预加载时遇到的坑,给textview赋值时出现的空指针异常

    FragmentPagerAdapter加载fragment并使用setUserVisibleHint()处理预加载时,给textview赋值时出现的空指针异常 public class BaseFr ...

  6. jquery.imgpreload.min.js插件实现页面图片预加载

    页面分享地址: http://wenku.baidu.com/link?url=_-G8miwbgDmEj6miyFtjit1duJggBCJmFjR2jky_G1VftD9eS9kwGOlFWAOR ...

  7. jquery实现图片预加载

    使用jquery实现图片预加载提高页面加载速度和用户体,本就为大家详细分析jquery图片预加载的实现原理. 什么时候使用图片预加载? 如果页面使用了很多不是最初加载便可见的图片,有必要进行预加载: ...

  8. jQuery实现图片预加载提高页面加载速度和用户体验

    我们在做网站的时候经常会遇到这样的问题:一个页面有大量的图片导致页面加载速度缓慢,经常会出现一个白页用户体验很不好.那么如何解决这个问题呢?首先我们会想到的是提高服务器性能,使用静态缓存等手段来加快图 ...

  9. 转载:用Jquery实现的图片预加载技术,可以实现有序加载和无序加载!

    一.背景 我们在做页面的时候,从用户体验的角度出发,肯定是希望用户以最快的速度看到完整的页面信息,但在实际情况中经常会遇到些问题. 比如受网速影响,页面加载素材的时间比较长,页面会出现短时间的错乱或者 ...

随机推荐

  1. The Role of View Controllers

    https://developer.apple.com/library/content/featuredarticles/ViewControllerPGforiPhoneOS/index.html# ...

  2. 关于springboot项目的jar和war两种打包方式部署的区别

    关于springboot项目的jar和war两种打包方式部署的区别 关于springboot项目的jar和war两种打包方式部署的区别? https://bbs.csdn.net/topics/392 ...

  3. vue.js双向绑定之--select获取text

    在大多数情况下select下拉菜单都是value和text设置不同的值的,value一般来说是与后台交互的值,而text是前端用来显示的文本: 但是,vue.js对到表单的双向绑定时如果option设 ...

  4. js-Cannot read property 'innerHTML' of null

    原因:1.$('#xxx') 或$('.xxx')不存在 2.$('#xxx')或$('.xxx')的值为空

  5. ubuntu及Cenos国内镜像下载

    打开:https://man.linuxde.net/download/ CentOS 7提供了三种ISO镜像文件的下载: DVD ISO 标准安装版,一般下载这个就可以了(推荐) Everythin ...

  6. linux查看反汇编

    生成反汇编文件 gcc xxx.c -g -o a.out objdump a.out -dSsx > file 调试的时候查看反汇编: gdb a.out ...layout asm 参考博文 ...

  7. 20181107 模拟赛T1:快乐传递政治正确版

    问题描述 David 有很多好朋友.有些期末季刚结束,有些人很快乐,但有些不太快乐,David 想把快乐传递给每个人,作为心理学大师,他准备了如下计划:David 的朋友中有 n 个男生和 m 个女生 ...

  8. Impala 架构探索-Impala 系统组成与使用调优

    要好好使用 Impala 就得好好梳理一下他得结构以及他存在得一些问题或者需要注意得地方.本系列博客主要想记录一下对 Impala 架构梳理以及使用上的 workaround. Impala 简介 首 ...

  9. markdown转html

    今天临时要写接口文档,然后发现部门给的文档是markdown文件的,而接口文档是要html格式的,因此想直接把markdown转为html 这里我使用的是marked 首先初始化一个node项目 np ...

  10. GoCN每日新闻(2019-11-11)

    GoCN每日新闻(2019-11-11) GoCN每日新闻(2019-11-11) 1. Go的内存管理与回收 https://medium.com/a-journey-with-go/go-memo ...