stack images one onto another (javascript)

I have the following problem. I want to write my own slide show in javascript. So the idea is to put many images (with the same width and height) onto each other and then change their opacity via javascript. But in order to put one image onto another I need to use the absolute position (do I?). So then I can't trace the relative position (for example in a table).

The idea is to get the position of a parent element, put (ghost) an opacity-0 image in it (to get all the scalling of table) and set the absolute position of images to that position. So far so good. But if there is more then one slide show in the table then other slide shows are chaotically put on a page. This happens, because the position of a table block changes after putting first slide show. Unfortunetly functions which get the position of an element they always get it BEFORE inserting开发者_如何学Go images via javascript. So how to do what I want?

I hope I explained my problem clear enough, waiting for replies. :)

---

I would look more into adjusting the Z-index of the image as this is the three dimensional position part. By adjusting the Z-index in a programmatic fashion you can get your slide show effect as well.

If your images are all the same size, and encased inside a table, set your cells to the size of the image(s) and that should fix the chaotic problem.

---

You can just use a pre-made slideshow such as the one here: http://jquery.malsup.com/cycle/

It sounds like it should do everything that you want