js图片预加载实现!
var myImage = (function(){
var imgNode = document.createElement( 'img' );
document.body.appendChild( imgNode );
return {
setSrc: function( src ){
imgNode.src = src;
}
}
})();
var proxyImage = (function(){
var img = new Image;
img.onload = function(){
myImage.setSrc( this.src );
}
return {
setSrc: function( src ){
myImage.setSrc( 'file:// /C:/Users/svenzeng/Desktop/loading.gif' );
img.src = src;
}
}
})();
proxyImage.setSrc( 'http:// imgcache.qq.com/music/photo/k/000GGDys0yA0Nk.jpg' );
js图片预加载实现!的更多相关文章
- js图片预加载
图片预加载有大体有几种方式 1.html标签或css加载图片. 显而易见我们使用img标签或者通过标签的background-image属性都可以实现图片的预加载.但是为了避免初次载入过多图片影响体验 ...
- js图片预加载与延迟加载
图片预加载的机制原理:就是提前加载出图片来,给前端的服务器有一定的压力. 图片延迟加载的原理:为了缓解前端服务器的压力,延缓加载图片,符合条件的时候再加载图片,当然不符合的条件就不加载图片. 预加载 ...
- js图片预加载后触发操作
为了使得图片加载完,再触发回调函数,需进行图片预加载处理 function loadImage(url, callback) { var img = new Image(); img.src = ur ...
- js图片预加载以及延迟加载
当我们需要做图片轮播的时候,如果让图片提前下载到本地,用浏览器缓存起来,我们可以用Image对象: function preLoadImg(){ var img=new Image(); img.sr ...
- JS图片预加载插件
在开发H5项目中有时候会遇到要加载大量图片的情况,利用预加载技术可以提高用户浏览时的体验. 1)概念:懒加载也叫延迟加载:JS图片延迟加载,延迟加载图片或符合某些条件时才加载某些图片.预加载:提前加载 ...
- js图片预加载、有序加载
<!DOCTYPE html><html lang="zh-CN"><head> <meta charset="UTF-8&qu ...
- JS实现图片预加载无需等待
网站开发时经常需要在某个页面需要实现对大量图片的浏览;用javascript来实现一个图片浏览器,让用户无需等待过长的时间就能看到其他图片 网站开发时经常需要在某个页面需要实现对大量图片的浏览,如果考 ...
- 外贸建站之图片预加载JS代码分享
外贸建站之图片预加载JS代码分享 function preloadimg() { setTimeout(function() { new Image().src = "images/2017 ...
- 图片预加载 js css预加载
图片预加载, 效果非常明显, 特别是有多个图, 方法很简单 , 体验提升了不少 <div class="hidden"> <script type= ...
随机推荐
- 数据分析相关概念(numpy)
矢量 矢量是指一堆形成的集合. 多维数组也叫做矢量化计算. 单独一个数叫做标量 例: import datetime as dt import numpy as np n2=10000 start2 ...
- mysql tar安装模式
mysql解压版安装过程,之前安装mysql一直用linux yum和rpm方式.今天试了下tar包方式有点麻烦记录下1.安装lrzsz-0.12.20-27.1.el6.x86_64.rpm方便操作 ...
- 防止xss漏洞-编码转义
用JS进行转义还是用PHP进行转义,最后存入数据库的是什么形式 比如:用户输入: <script>alrt(0);</script>那数据库里面存储的是源数据还是转以后的数据: ...
- 常用指令linux总结
linux的基础操作命令: 常见命令: man 查看帮助文档 用法:man + 命令 help 查看指定命令的用法 用法: 命令 --help(有空格) tab linux下命令与文件名补全 用法:在 ...
- SVN 分支操作
一 拉取分支 1 选择浏览 2 输入svn项目路径:https://IP/svn/ 3 选择拉取的项目 4 下载到本地路劲 右键选中的分支—CheckOut 选择本地路劲 二 分支合并 1 分支合并 ...
- anaconda新建环境
安装tensorflow等如下: https://blog.csdn.net/Gransand/article/details/80713810 修改默认打开目录如下: https://blog.cs ...
- 【转载】99%的人都理解错了HTTP中GET与POST的区别
作者:Larry链接:https://zhuanlan.zhihu.com/p/22536382来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出处. 原文链接 作者:WebT ...
- c++与js脚本交互,C++调用JS函数JS调用C++函数
一.javascript调用c++,方法有两种 方案1: 1.html编写 <html><head></head><body><h1>TES ...
- System.Drawing.Image.cs
ylbtech-System.Drawing.Image.cs 1.程序集 System.Drawing, Version=4.0.0.0, Culture=neutral, PublicKeyTok ...
- reboot与shutdown -r now 区别与联系(又收集了init和halt的小知识)
在linux命令中reboot是重新启动,shutdown -r now是立即停止然后重新启动,都说他们两个是一样的,其实是有一定的区别的. shutdown命令可以安全地关闭或重启Linux系统,它 ...