Pop Up transition not very seamless

[Rocketman]

Hello All,

So I have a page with a central image about 600x600 pixels, and below this image there are half a dozen menu choices in a vertical column. Each menu option is a seperate text box. I have set things up so that when the mouse hovers over one of the menu options/text lines it will change the image above to a different image. Each menu option/text line has its own seperate image. But all the images appear (fading in and out) at exactly the same point i.e. they all overlap completely, so the effect is the main image changing when the cursor moves over each option. The relevant text line also goes slightly darker as the cursor is hovered.

I have achieved this by using the mouseover layer for the darker text, and then a series of seperate pop-up layers, one for each different image. Each image on each pop-up layer is exactly the same size, and located at exactly the same position on the page.

The effect works well in principle. But the problem I am having, and this is the best way I can describe it, is that its somewhat "hit and miss". So sometimes when the cursor is hovered over a menu item the pop-up image will be displayed as intended, othertimes it isn't. There doesn't seem to be a pattern to this, other than the pop-up layers at the top tend to be more reliable than the ones further down (in terms of the hierarchy of where each layer is on the page). I think what might be happening is that all of the layers are being triggered by the cursor moving over the text line, and the pop-up layer is doing what it should, but some of them get 'stuck' or hidden behind ech other, so it looks like they aren't popping! But i'm guessing here a bit.

I hope that makes sense. If anyone has any suggestions i'd be very grateful as its kind of ruining my page at the moment!

Thanks
Tom

[gwpriester]

Can you give us a link to the problem page so we can see for ourselves what is going on.

[Acorn]

It is possible that the height of the text boxes is larger than you visualise.

Here is a go at what I think you have described; I get no dithering - Layer Scroll.xar.

Acorn

[Rocketman]

It is possible that the height of the text boxes is larger than you visualise.

Here is a go at what I think you have described; I get no dithering - Layer Scroll.xar.

Acorn

Thanks, yes thats pretty much exactly it, except the menu on my page is underneath the image, and the images fade in and out, but its the same principle.

So are you saying that my text boxes are too close together, or there is overlap between them, which could cause the dithering?

I'll try spacing them out more, or perhaps using a transparent rectangle as the trigger rather than the actual text boxes

Many thanks