I have the following code, i'm trying to make a loader appear then the
image fade in once it is loaded. I want to make the function reusable so i can just add an
image to a div with the loader id and it will work.
I cant figure out how to select the parent loader div from inside the
image. the commented line works fine but, i think that will select all divs. i just want to select the parent loader div. can anyone help, thanks.
<div id="loader" class="loading">
<img src="http://www.inhousedesign.co.nz/images10/caravan_01.jpg" style="display: none;"/>
</div>
$("#loader").each(function(){
var source = $(this).find("img").attr('src');
var img = new Image();
$(img).load(function(){
$(this).hide();
//$("#loader").removeClass('loading').append(this);
$(this).parents("div:first").removeClass('loading').append(this);
$(this).fadeIn(800);
}).attr('src', source);
});
