[英]how to load images after everything else is loaded?
i got some idea that to load a fake image on a div before original image finishies loading and that to be after winodws load.i got some code but cant understand in which part i have to put src image for fake image and original image.do help me out in this code . 我有一些想法,要在原始图像完成加载之前在div上加载伪图像,并且要在winodws加载之后加载div。帮我解决这段代码。 my html part is
我的html部分是
<div class="myimage"><img src="myimage.jpg" /></div>
note:Trick is to set the src attribute only when that source is loaded in temporary img. $(img).load(fn);
注意:技巧是仅在临时
img. $(img).load(fn);
加载该源时设置src属性img. $(img).load(fn);
img. $(img).load(fn);
handles that. 处理。
$(function(){
$.each(document.images, function(){
var this_image = this;
var src = $(this_image).attr('src') || '' ;
if(!src.length > 0){
//this_image.src = options.loading; // show loading........
var lsrc = $(this_image).attr('lsrc') || '' ;
if(lsrc.length > 0){
var img = new Image();
img.src = lsrc;
$(img).load(function() {
this_image.src = this.src;
});
}
}
});
});
You can use data
attribute to do it: 您可以使用
data
属性来执行此操作:
<div class="myimage"><img data-orig="original.jpg" src="fake.jpg" /></div>
$(window).load(function(){
$('.myimage img').attr("src", $(this).data('orig')).removeAttr('data-orig');
});
You can add your images url to a custom data-url attribute and make your image url a base64 1x1 gif. 您可以将图像url添加到自定义data-url属性,并使图像url为base64 1x1 gif。 And then when the page loads completely you can get your url from it.
然后,当页面完全加载时,您可以从中获取URL。 Basically it will be like this.
基本上就是这样。
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="original-image.png" />
$(window).load(function() {
$("img").each(function() {
$(this).attr("src", $(this).attr("data-src"));
});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.