TR Forums

I have a javascript / DHTML menu system that is basically an accordion-style type drop out that automatically drops out the first level. In this level there are 4 thumbnail-ish images. If the cache of these images is not created beforehand, the dropout fails because the images aren't loaded fully. So to circumvent this, on the page before this page, I created a hidden div with those thumbnails in it. Providing they spend a half second on this page, it should cache them I'd think.

Is there a better way without the use of javascript? This was just the first thought I had.

I can't say that I keep up on the cutting edge of web coding techniques, but I think the consensus these days is to pre-load with CSS -- that's especially true since people are doing as much as possible, and sometimes everything including fancy pop/drop menus, without js so it works even on browsers with noscript, etc. You don't need to do it on the prior page, either -- if you were using javascript you can do it in the load event for the page, or you can stick them in the head tag, or whatever.

Edit: Never mind. UG said what I wanted to say.

Oddly enough, my initial technique of using a div to hide all the images inside (display:none) did not work, however, adding a class where the display is set to none and apply said class to each image DOES work. Not sure why, but it works. So my initial CSS-based approach was correct in theory, but in practice the idea changes just a tad. Thanks!