Opacity on images

[Dafied]

Hi there,

Firts of all, please excuse me as i am not english speaker...


I've found in this site this script that make change opacity on images:

http://www.dynamicdrive.com/dynamicindex11/gradualfader.htm

The problem is that i want the opposite action i.e I want that all images are not with the opacity effects but are only with when i mouseover on an image that the rest of the images have the opacity effect.

Exemple:
<img 1><img 2><img 3> == with no opacity

When i mousevoer on img 1, img 2 & 3 have the opacity.
If i mouseover on img2, the effect appear on imgs 1 &3 etc etc...

I tried to change the value on the script but in vain.

Anyone could tell me wich line i have to modify on the script ?

Here's the script:
http://www.dynamicdrive.com/dynamicindex11/gradualfader.js

Thanks in advance for any help !

[jscheuer1]

That script is only for fading in. Use this one, which goes either way:

http://www.dynamicdrive.com/forums/showthread.php?t=22534

demo:

http://home.comcast.net/~jscheuer1/side/files/fade_advanced_preset_write.htm

[Dafied]

Ok thank you but this is the same effect.

I tried with my own images and they are with the effect of opacity before the 'mouseover' and i just wanna the effect only when i mouseover...

peace,
D.

[jscheuer1]

In this section:


var faders=[];
// Preset each image's initial opacity (0 to 100):
// ex: faders[x]=['image_id', initial_opacity];
faders[0]=['mona', 100];
faders[1]=['arch', 100];

set the initial opacity. Make it 100 if you want your images to start out 'normal' or 100% opaque.

Then, use:


<img id="mona" onmouseover="fade(this, 'out', 30);" onmouseout="fade(this, 'in');" . . .

[Dafied]

Yes thank you its working... but its not really what i want 'cause i have many images.

Example:
<img1><img2><img3> etc == no opacity

if i mouveover on img1 ---> img 2&3 become "opacity"
if i mouseover on img2 ---> img 1&3 become "opacity"......

That 's why the script i mentionned before is perfect but its just the opposite of what i want...

Nevertheless, thx again, i appreciate ur help !

[jscheuer1]

You can use the id of the image(s) you want to change:


<img id="some_id"
onmouseover="fade('some_id2', 'out', 30);fade('some_id3', 'out', 30);"
onmouseout="fade('some_id2', 'in');fade('some_id3', 'in');" . . .

This assumes that these (or something like them) exist (these could also have events that affect other images):


<img id="some_id2" src="pic2.jpg">
<img id="some_id3" src="pic3.jpg">

and are setup here:


var faders=[];
// Preset each image's initial opacity (0 to 100):
// ex: faders[x]=['image_id', initial_opacity];
faders[0]=['some_id2', 100];
faders[1]=['some_id3', 100];

You can setup as many images as you want, and have as many events distributed however you like in your HTML code that change however you like whatever images you have set up.

[Dafied]

Thank you very much !!!!