/**

    **将图片加载到内存中，在页面任何位置引用的时候，直接从缓存中读取，提升用户的体验，提高网站的流畅度。**

**/

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>预加载图片</title>

<script type="text/javascript" src="jquery/jquery-1.9.1.js"></script>

<script type="text/javascript">

(function($) {

  var cache = [];

  $.preLoadImages = function() {

    var args_len = arguments.length;

    for (var i = args_len; i--;) {

      var cacheImage = document.createElement('img');

      cacheImage.src = arguments[i];

      cache.push(cacheImage);

    }

  }

})(jQuery)

$.preLoadImages('images/sample1.jpg','images/sample2.jpg','images/sample3.jpg');

</script>

</head>

<body>

</body>

</html>

jQuery进行图片预先加载的更多相关文章

  1. jquery实现图片预加载

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

  2. 使用jQuery实现图片懒加载原理

    原文:https://www.liaoxuefeng.com/article/00151045553343934ba3bb4ed684623b1bf00488231d88d000 在网页中,常常需要用 ...

  3. jQuery的图片懒加载

    jQuery的图片懒加载 function imgLazyLoad(options) { var settings = { Id: $('img'), threshold: 100, effectsp ...

  4. jquery实现图片预加载提高页面加载速度

    使用jquery实现图片预加载提高页面加载速度和用户体 我们在做网站的时候经常会遇到这样的问题:一个页面有大量的图片导致页面加载速度缓慢,经常会出现一个白页用户体验很不好.那么如何解决这个问题 呢?首 ...

  5. jQuery.imgLazyLoad图片懒加载组件

    一.前言 当一个页面中请求的图片过多,而且图片太大,页面访问的速度是非常慢的,对用户的体验非常不友好:使用图片懒加载,可以减轻服务器的压力,增加页面的访问量,这里主要是总结一下我自己写的图片懒加载组件 ...

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

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

  7. jquery <img> 图片懒加载 和 标签如果没有加载出图片或没有图片，就显示默认的图片

    参考链接:http://www.jq22.com/jquery-info390 或压缩包下载地址:链接:http://pan.baidu.com/s/1hsj8ZWw 密码:4a7s    下面是没有 ...

  8. 基于jQuery的图片异步加载和预加载实例

    如今的网页中有很多图片,比如相册列表,那么如果一次性读取图片将会瞬间加重服务器的负担,所以我们用jQuery来实现图片的异步加载和预加载功能,这样在页面的可视范围内才会加载图片,当拖动页面至可视界面时 ...

  9. jquery的图片异步加载

    <script src="jquery.js"></script> <script src="jquery.lazyload.js" ...

随机推荐

  1. C#基础|值类型和引用类型以及传参问题

    为了明白什么是值类型和引用类型,先引入你两个概念.堆内存与栈内存   堆内存与栈内存   由于咱的描述能力有限,就不对其下定义了,来看看两者的作用.   共同点: 都是用来存放数据的   不同点: 堆 ...

  2. leetcode-110：判断平衡二叉树 Java

    Balanced Binary Tree Given a binary tree, determine if it is height-balanced. For this problem, a he ...

  3. Linux 串行终端，虚拟终端，伪终端，控制终端，控制台终端的理解

    转自Linux 串行终端,虚拟终端,伪终端,控制终端,控制台终端的理解 终端:输入和输出设备(键盘 + 显示器). 串行终端:与机器的串口对应,每一个串口对应一个串行终端,串口对应的是物理终端. 虚拟 ...

  4. http://sofar.blog.51cto.com/353572/1540874

    http://sofar.blog.51cto.com/353572/1540874 http://singlefly.blog.51cto.com/4658189/1368579 http://ww ...

  5. UVA 10273 Eat or Not to Eat?

    这个题目一直以为是要用图论知识来做,可是一点建图的思绪都没有,后来知道暴力便可破之.由于牛的产奶周期最大为10,1.2.3.....10的最小公倍数是MT = 2520,所以把MT作为最大的周期,然后 ...

  6. HTML5文件拖拽

    HTML5新增的File API, 可以获取名称.文件大小.类型等信息,需先对DOM中的Element进行拖拽事件绑定 相关API 首先获取节点,绑定拖动到该节点的事件,可以改变鼠标形状 var dr ...

  7. 匿名函数和Lambda表达式

    这个题目有点牵强,真不知道如何取一个比较中意的名称,写技术博客,我很少拘泥小节,但是注重细节,如果细节都出现问题了,那么这个博文也就失去了价值. 其实应该从委托说起,委托是C#中的一个重要的内容,记得 ...

  8. Application.EnableVisualStyles();

    Application.EnableVisualStyles(); Application.SetCompatibleTextRenderingDefault(false);  Application ...

  9. WinForm实现简单的拖拽功能(C#)（2）

    首先创建一个winform应用程序,添加listbox1与listbox2,拖拽listbox1的项到listbox2上去. 具体代码如下 namespace OLE拖拽{ public partia ...

  10. libvlc 双击,鼠标事件消息响应

    基于vlc 2.1 动态库实现接收双击消息的接收,使双击vlc播放画面可以全屏显示. 需要其他版本的vlc可以与我联系(有偿进行修改) 下载地址:http://download.csdn.net/de ...