Best way to add progress bar to image?

Programmer Question

I have a custom gallery plugin that I have created and I am wanting to add a progress bar or a progress gif in place of all images before they are loaded.

I know that I could potentially use the jQueryUI progress bar for this, but I do not want to use a jQueryUI theme, and I do not know how to add it to an image that is currently loading.

My other two options are, create my own progress bar, or use an animated gif. Currently I am leaning towards a gif because it would be a lot easier to add, and I would not have to theme it.

However it would be pretty cool to have the progress bar if it is relatively simple to add to an image. Does anyone have an example of how to add a jQuery progress bar, or some other progress bar to an image while it is loading?

Find the answer here