Question

I am adding some images to a div from a database in the Page_Load() event. When you hover over one of these black and white images, you see the colour image. I would like to pre-load the colour images but am having issues doing it. My current code loops through all the images, and adds the following:

<script type="text/javascript">
<!-- 
$(document).ready(function() { 
    $("<img />").attr("src", "%s").load(function(){ 
        $("body").append($(this)); 
    }); 
});
--></script>

to a RegisterClientScriptBock where %s is the path to the image. I have tried with and without appending it to the body but neither seem to work. From what I can see, this seems to be the way to pre-load images but I am open to other suggestions. Am I having issues because I am doing it on the fly?

Thanks.

Answer 1

Have you thought about creating a div that’s absolutely positioned -10000px left and top, height/width 1px, and then throwing all of the images in there with html? I’m not sure why you’d need to use js for this one.