Hi! Anyone

You didn't give us the code for scripts2.js. You just pasted 2 copies of avalon2.htm.

Hi nyej,
I've amended and just post my scripts2.js. Please comment. Thanks.

Ken

I'm not sure you can programmatically change the zIndex and get the browser to re-render which object is on top. Maybe there is a way but zIndex is finicky and I've always had problems with it.

If I were doing this, I would do it this way:

Have each element's style.display set to "none".
Then whichever element you want to show up on top, set that elements style.display to "inline", and the others to "none".

That way only one object is shown at a time and you don't have to worry about overlapping.

I just figure it out with 3 images stack because I used a wrong command, setTimeout. Now I use setInterval instead of setTimeout.