preload image with jquery
Posted
by robertdd
on Stack Overflow
See other posts from Stack Overflow
or by robertdd
Published on 2010-04-20T22:02:08Z
Indexed on
2010/04/20
22:13 UTC
Read the original article
Hit count: 244
ok, I spent 2 days trying to preloaded images but no succes! i have this function:
jQuery.getlastimage = function(id) {
$.getjs();
$.post('operations.php', {'operation':'getli', 'id':id,}, function(lastimg){
$("#upimages" + id).html('<a href="uploads/'+ lastimg +'?'+ (new Date()).getTime() +'"><img class="thumbs" id="' + id + '" alt="' + lastimg + '" src="uploads/' + lastimg +'?'+ (new Date()).getTime() + '" /></a>');
});
};
while the image loading i want to appear a gif or a text "Loading...".
the function will get something like this:
<div class="upimage">
<ul class="thumbs" id="upimagesQueue">
**<li id="#upimagesRIFDIB">
<a href="uploads/0001.jpg?1271800088379">
<img src="uploads/0001.jpg?1271800088379" alt="0001.jpg" id="RIFDIB" class="thumbs">
</a>
</li>**
<li>
....
</li>
</ul>
</div>
i tryed like this:
...
$.post('operations.php', {'operation':'getli', 'id':id,}, function(lastimg){
$("#upimages" + id)
.html('<a href="uploads/'+ lastimg +'?'+ (new Date()).getTime() +'"><img class="thumbs" id="' + id + '" alt="' + lastimg + '" src="uploads/' + lastimg +'?'+ (new Date()).getTime() + '" /></a>')
.hide()
.load(function() {
$(this).show();
});
...
but all the <li>
will hide and after is loading the image appear, i want the <li>
to apear with a gif or a text in it and after the image is loaded the link and the image to apear!
How to do this? Anyone have an idea? Thanks!
© Stack Overflow or respective owner