下面的是我认为最简单的预加载图片里!在页面进入时就开始加载

var imgARR = ['images/xmImg1.png','images/xmImg2.png','images/xmImg3.png','images/xmImg4.png','images/xmImg5.png','images/xmImg6.png',
                            'images/xgimg1.png','images/xgimg2.png','images/xgimg3.png','images/xgimg4.png','images/xgimg5.png','images/xgimg6.png','images/dlimg14.png',
                            'images/dlimg1.png','images/dlimg2.png','images/dlimg3.png','images/dlimg4.png','images/dlimg5.png','images/dlimg6.png''images/dlimg7.png','images/dlimg8.png',
                            'images/dlimg9.png','images/dlimg10.png','images/dlimg11.png','images/dlimg12.png','images/dlimg13.png','images/ljimg1.png','images/syimg1.png','images/syimg2.png',
                            'images/syimg3.png','images/syimg4.png','images/syimg5.png','images/syimg6.png','images/syimg7.png','images/syimg8.png','images/syimg9.png','images/syimg10.png',
                            'images/syimg11.png','images/syimg12.png','images/syimg13.png','images/syimg14.png','images/syimg15.png','images/syimg16.png'];

var imgAll= [];

function preloadImg(arr) {
           for(var i =0; i< arr.length ;i++) {
                  imgAll[i] = new Image();
                  imgAll[i].src = arr[i];
           }
}

preloadImg(imgARR );

//或者延迟的文档加载完毕在加载图片

$(function () {
      preloadImg(imgARR );
})

js-页面进入时同时实现-图片预加载的更多相关文章

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

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

  2. JS实现图片预加载无需等待

    网站开发时经常需要在某个页面需要实现对大量图片的浏览;用javascript来实现一个图片浏览器,让用户无需等待过长的时间就能看到其他图片 网站开发时经常需要在某个页面需要实现对大量图片的浏览,如果考 ...

  3. js原生图片懒加载 或 js原生图片预加载,html标签自定义属性

    使用原声js来实现图片预加载,或图片懒加载,小伙伴们可以根据项目需要来结合vue或者是react来进行修改. 一.什么是图片懒加载或什么是图片预加载 当访问一个页面的时候,先把img元素或是其他元素的 ...

  4. js 函数的多图片预加载(preload) 带插件版完整解析

    前言:         本人纯小白一个,有很多地方理解的没有各位大牛那么透彻,如有错误,请各位大牛指出斧正!小弟感激不尽.         本篇文章为您分析一下原生JS实现图片预加载效果 本篇文章写的 ...

  5. 利用简洁的图片预加载组件提升h5移动页面的用户体验

    在做h5移动页面,相信大家一定碰到过页面已经打开,但是里面的图片还未加载出来的情况,这种问题虽然不影响页面的功能,但是不利于用户体验.抛开网速的原因,解决这个问题有多方面的思路:最基本的,要从http ...

  6. js图片预加载与延迟加载

    图片预加载的机制原理:就是提前加载出图片来,给前端的服务器有一定的压力. 图片延迟加载的原理:为了缓解前端服务器的压力,延缓加载图片,符合条件的时候再加载图片,当然不符合的条件就不加载图片.​ 预加载 ...

  7. 图片预加载 js css预加载

    图片预加载, 效果非常明显, 特别是有多个图, 方法很简单 , 体验提升了不少 <div class="hidden">        <script type= ...

  8. 图片预加载插件 preLoad.js

    1.preLoad.js插件 /*! * preLoad.js v1.0 * (c) 2017 Meng Fangui * Released under the MIT License. */ (fu ...

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

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

随机推荐

  1. linux :没有找到 ifconfig netstat

    linux :没有找到 ifconfig netstat ubuntu sudo apt install net-tools -y centos yum install net-tools

  2. TB平台搭建之一

    最近在搭建公司的testbench,主要有一下总结: 1.TB主要有两部分:部分一,软件部分主要用C写的,她的作用是写硬件的驱动(其实就是让核的外围设备可以正常工作或工作到特定的环境上)甚至有可能写整 ...

  3. thinkphp5开发restful-api接口学习 教程视频 接口文档

    目录 1. 获取验证码 2. 用户注册 3. 用户登录 4. 用户上传头像 5. 用户修改密码 6. 用户找回密码 7. 用户绑定手机号 8. 用户绑定邮箱 9. 用户绑定用户名(手机/邮箱) 10. ...

  4. Shuffle UVA - 12174 尺取法

    题目:题目链接 思路:见紫书,对具体操作方式还不是很理解,代码是从一个题解里看的,以后多回顾下,需要理解 代码: #include <iostream> #include <cstr ...

  5. 利用PowerDesigner逆向工程导出PDM模型及生成文档

    原文:利用PowerDesigner逆向工程导出PDM模型及生成文档 最近需要对老项目进行重构优化,由于项目都是好几年前的,相关设计资料很不全,最基本的数据库设计文档都没有,只能利用PowerDesi ...

  6. foreach遍历数组的表格

    <?php /** * * @authors Your Name (you@example.org) * @date 2017-03-17 19:06:19 * @version $Id$ */ ...

  7. Struts2报错:No result defined for action xxx and result input

    case如下: 1. 后台程序要升级, 修改了一些功能,但是没有修改或者添加action的参数. 2. 数据库需要升级,执行了一些sql,修改过action的值. 3. 当修改某个已经存在的记录,然后 ...

  8. TOJ1196: RSA Signing

    题不在多,大概是多了也可能就是菜逼 1196: RSA Signing Time Limit(Common/Java):3000MS/30000MS     Memory Limit:65536KBy ...

  9. JQuery常用的HTML页控制取值、赋值

    1,关于tab页签 获取当前页签的属性: var tabsSelect=$("#easytabs").tabs("getSelected"); var titl ...

  10. ZOJ-3953 Intervals,t

    Intervals 题意:给出n个区间,求最少删除多少个区间使得任意三个区间都不相交. 思路:按区间左端点排序,每次选取r最大的两个与当前比较,如果能放更新r,否则删除r最大的.关键就在怎么删除r最大 ...