onmouseover

[MaGiCSuN]

Hi,

i have this onmouseover onmouseout code that i want to paste into my .css file i just simply don't know how to edit it so that it works into a .css file.

onmouseover="this.style.filter='alpha(opacity=0,finishOpacity=100,style=2 )'" onmouseout="this.style.filter=''"

if possible i want this to be into an img class like this:

img { codes here }

or in a new class:

.NAME { codes here }

NAME to whatever i want. Because the images i want to fade are all in groups i can easily surround them with one div. But i just don't want them to edit itself.

is this possible? i know that this code is only for linked images, and that is allright.

Thanks

Love,
Mirna

[bloodyveins]

onMouseOver="this.className='yourClass'" onMouseOut="this.className='yourClassAgain'"

should work when you use external css file

[MaGiCSuN]

No what i mean is i want the WHOLE code to fit into a .css file. I don't want that onmouse over thing to add in the image at all. It's only a hassle with editing.

example:

if you type in your css file this img { border: 1px solid black } then all the images that are on the page will have a 1px solid black border surrounding them

now i want the same but then with the fading part. I don't want to edit each image one by one. I just want to insert the code into the img class so that automatically ALL the images are faded and go to 100% opacity when hovering them.

Is that possible?

so i have this code:

onmouseover="this.style.filter='alpha(opacity=0,finishOpacity=100,style=2 )'" onmouseout="this.style.filter=''"

it only needs to be edited in some way, i just have no clue how. Like with border="0" you take away the = and " " and then you edit it so that it fits into a stylesheet. So it becomes border: 1

Thanks

Love,
Mirna

[keith]

onmouseover/onmouseout is javascript, not css. you can't just go lumping javascript together with css. that'd be like trying to perform php functions in perl.

[MaGiCSuN]

ok thank you :) that's what i wanted to know :)

[byrdgirl13]

Why doesn't :hover work on images in css? Because I tried this:

img.effect:hover {filter:alpha(opacity=0,finishOpacity=100,style=2)}

and

.effect:hover {filter:alpha(opacity=0,finishOpacity=100,style=2)}

making the image class="effect" but the :hover keeps it from working either way (if I take that out, the filter works).