Link to home
Start Free TrialLog in
Avatar of jdav357
jdav357

asked on

CSS opacity

Hi,
I want to have an image that is faded out and upon hover fades in.
I know to set the image opacity to .25 makes it faded out, but what is the code to make it fully viewable again - 100% doesn't appear to work..
Avatar of Adoryc666
Adoryc666

If you set it to 1.0 it should go back to fully viewed.
In order to make it fully viewable, you would just delete or comment out the opacity line in your CSS.
See example 2 on the w3schools page on opacity, sounds exactly like you are trying to do.

http://www.w3schools.com/Css/css_image_transparency.asp
<img src="klematis.jpg" style="opacity:0.4;filter:alpha(opacity=40)"
onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100"
onmouseout="this.style.opacity=0.4;this.filters.alpha.opacity=40" />

<img src="klematis2.jpg" style="opacity:0.4;filter:alpha(opacity=40)"
onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100"
onmouseout="this.style.opacity=0.4;this.filters.alpha.opacity=40" />

Open in new window

SOLUTION
Avatar of SAM1
SAM1

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
ASKER CERTIFIED SOLUTION
Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
SOLUTION
Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial