zoukankan      html  css  js  c++  java
  • 图片预读

    尽管我们可以使用CSS Sprites等各种CSS手段来避免页面交互时图片加载延时的问题,但有些情况下依然需要使用JS脚本的手段来实现图片预读。

    以下是基于jQuery实现图片预读的方法(用jQuery只是为了方便,你也可以使用原生js或者其他类库),以下代码请放入js文件中或者 <script/>块里(事先请保证已加载jQuery类库):

    function imagePreload(images){     var arr = ['<div style="display:none;">'];     $.each(images, function(i, data){         arr.push('<img src="'+ data +'" />');     });     arr.push('</div>');     $('body').append(arr.join('')); }

    调用的时候,使用以下代码:

    var preloadImages = [], preloadDir = './img/'; //preloadDir为图片文件所在的路径 preloadImages.push(preloadDir + 'a.jpg'); //这里的每一行添加一张图片,请自行修改图片文件名 preloadImages.push(preloadDir + 'b.jpg'); preloadImages.push(preloadDir + 'c.jpg'); imagePreload(preloadImages); //调用之前写的preload方法

    如果不喜欢使用jQuery,那么可以将这个方法改写为:

    function imagePreload(images){     var arr = [], elm = document.createElement('div');     for(var i=0; i<images.length; i++){         arr.push('<img src="'+ images[i] +'" />');     }     elm.style.display ='none';     elm.innerHTML = arr.join('');     document.body.appendChild(elm); }
  • 相关阅读:
    JavaScript引用类型
    Java08_方法
    网络爬虫(一)
    openCV(四)——鼠标绘制
    openCV(三)——视频
    openCV(二)——基础绘制函数
    openCV(一) 读取保存图像
    JAVA07-数组
    JAVA06-while循环,do while循环
    JAVA05-switch多重选择
  • 原文地址:https://www.cnblogs.com/shihao/p/2168233.html
Copyright © 2011-2022 走看看