[jQuery] Re: Cycle plugin: some images not loading

[TNTitan]

 I think this is just a result of some of your images not yet being
 downloaded to the browser when Cycle transitions them in.   You can
 either add images dynamically (see the 'add' demos on the Cycle page)
 or wait until the window 'load' event fires (instead of using the
 'ready' event) to start Cycle.

I changed the page to hide the images until the window load is
complete, and then I am triggering Cycle.  That seems to be working
fine.  Thanks for the suggestion!

However, I still don't quite understand the previous behavior.  The
images were not missing just until they were downloaded.  They were
never displayed, even long after the page was loaded and the images
had been cycled through multiple times.  I agree that the problem
seems to be that the browser does not have a copy of the images, but I
can't explain why.  Is there something about starting Cycle before the
images are downloaded that causes the browser to stop downloading
them?  Is Cycle actually removing the images from the DOM rather than
just hiding them?  If so, that would explain what I am seeing.

TNTitan

[jQuery] Re: Cycle plugin: some images not loading

[TNTitan]

 It sounds like the size of the images could not be determined and that
 is unexpected if the markup explicitly declares the size.   If you
 have time, post a link for us to look at.  Thanks.

Thanks for responding, Mike.  I noticed today that setting the height
and width explicitly with CSS did not actually make all the images
show.  It did cause the area where the image should be to be the
correct size, but the image was still not displayed.  Please take a
look and see if you have any suggestions.  Hopefully I am just doing
something stupid and obvious.

http://new.tn4halumni.org

[jQuery] Cycle plugin: some images not loading

[TNTitan]

I am having a problem with some of my images not loading when using
Mike Alsup's Cycle plugin.  When my page loads and the images begin to
cycle, some of them just show as a small white rectangle (presumable
the border used for the images) while other images look fine.  It's
acting as though the images are not getting cached in the browser
before Cycle does its thing.

To recreate the problem, I clear my cache and refresh the page.  The
first image shows fine, but then when the images start to cycle, all
subsequent images just show as a small white box.  Then when I refresh
the page, the images typically appear just fine.  I have had some
instances where some, but not all, of the images show.

I am seeing this problem as described above in both Firefox 3 and
Safari 3.  In Opera 9.6, I see the subsequent images, but they are
displayed only about 20px tall.  In IE7, everything seems to work
fine.

I am using the minified version of jQuery 1.2.6 and the full version
of Cycle 2.30.

Javascript:

$(document).ready(function() {
$('.pics').cycle({
fx: 'zoom',
random: 1,
pause: 1,
delay: -1000,
timeout: 6000,
next: '.pics'
});
});

HTML:

div class=pics
img src=images/photos/1.jpg width=185 height=277 /
img src=images/photos/2.jpg width=185 height=277 /
img src=images/photos/3.jpg width=185 height=261 /
img src=images/photos/4.jpg width=185 height=276 /
img src=images/photos/5.jpg width=185 height=277 /
img src=images/photos/6.jpg width=185 height=277 /
img src=images/photos/7.jpg width=185 height=280 /
img src=images/photos/8.jpg width=185 height=276 /
img src=images/photos/9.jpg width=185 height=246 /
img src=images/photos/10.jpg width=185 height=276 /
img src=images/photos/11.jpg width=185 height=276 /
img src=images/photos/12.jpg width=185 height=277 /
img src=images/photos/13.jpg width=185 height=277 /
img src=images/photos/14.jpg width=185 height=276 /
img src=images/photos/15.jpg width=185 height=277 /
img src=images/photos/16.jpg width=185 height=277 /
/div

UPDATE:

As I have been writing this message, I have been trying some other
options to see if I can resolve the issue myself.  It looks like the
problem is solved by setting explicit height and width properties in
CSS.  Mike, if you are out there: is this expected behavior?