Gradual Element fader help please.

[AndyC_65]

1) Script Title:
Gradual Element fader

2) Script URL (on DD):
http://www.dynamicdrive.com/dynamicindex11/gradualfader.htm#layout

3) Describe problem:

I have the script downloaded and it works fine. I have an image that is clearly defined as four separate areas.

http://i18.photobucket.com/albums/b127/andyc65/comcasterpiechart.jpg

I would like to have the effect happen with mouseover any of the four parts (individually). Is there a way of defining areas within the image or script?

Thanks in advance for any help.

Andy C

[ddadmin]

There's no way to have the effect applied only to a portion of an image, unfortunately. What is possible is breaking the above image into four smaller images, then using CSS and absolute positioning to "stitch" them together so they appear as one. The script can then be applied to each of these 4 images.

[AndyC_65]

Thanks for the reply.

I feared this would be the answer - the shape of the images isn't going to make that easy.

cheers,

Andy C

[AndyC_65]

Following the advice given, I created four seperate images and have a couple of follow on questions:-

I used "style="position: absolute;" to position the 4 graphics to make them represent the one original graphic, but I now am having difficulty in centering them on the page as I can't overwrite the absolute positioning. I've tried putting this into a <div> and again, the absolute positioning seems to overwrite the positioning of the <div>.

Also, upon mouseover on the images, they appear as the whole image (square versus the main pie chart element of the image); is there a way to ensure they all react as if behind all the other images?

Many thanks in advance for any help.

cheers,

Andy C