I seem to be having a problem with some code similar to the pseudo-
code below. Assume that I am getting an XML document that has nodes
called "src" that hold image source urls, and that "someDivId" has a
display property of "none" set in the CSS.

- - -

$(function(){

   $.get( "doc.xml", function( data ) {

      $("#someDivId").append( "<img src='" + $("src[0]", data).text()
+ "' />" );
      $("#someDivId img").load(function(){
         $("#someDivId").css("display", "block");
      });

   }

- - -

In my code, the DIV is displaying before the image is loaded. However,
if I hard code the image into the HTML, give it an ID, and then attach
the load event to that, it works just fine. Thanks!

You could simply change it around a bit...

- create the image
- assign a load handler, with a callback to append the image to the
div and show the div
- set the image src

eg
$('<img />').load(function(){
    $(this).appendTo('#someDivId').parent(show);
  })
  .attr('src', $('src[0]', data).text());

NB Not all browsers like jQuery's load() as an image preloader; you
might want to check out Ariel Flesler's preload plugin?

On May 11, 11:44 pm, Giant Jam Sandwich <hal9...@reindel.com> wrote: