Preventing list items from displaying whilst overlay images load

I have created 6 divs .box that contain an unordered list and images with the images being absolutel开发者_JAVA技巧y positioned above each list. Is there a way I can make sure the content under the image isnt revealed whilst the content boxes fade in?

http://jsfiddle.net/NKFgC/

Kyle

Hide the container object with CSS display: none; until you're ready to show it, then change the display value with javascript.

Fix stop with stop(true, true)

http://jsfiddle.net/maniator/NKFgC/1/

Yes, there is, you can use callback functions. Keep the content hidden (display none or visibility hidden) and use something like:

$(element).fadeIn(300, function() {
    //show/hide content
});

here's the code:

http://jsfiddle.net/NKFgC/4/