View Full Version : Image-link opacity with CSS instead of java- with fade transition effect


WebBaka
10-13-2005, 02:23 AM
OK, so I have a image link with the class "ad". I found that with a CSS filter I can make the image change opacity without javascript (and with only one image).

My CSS:
a.ad img {filter:alpha(opacity=85);
opacity: 0.85;
border-top-color: silver;
border-top-style: solid;
border-top-width: 1px;
border-left-color: silver;
border-left-style: solid;
border-left-width: 1px;
border-right-color: silver;
border-right-style: solid;
border-right-width: 1px;
border-bottom-color: silver;
border-bottom-style: solid;
border-bottom-width: 1px;}

a.ad:hover img {filter:alpha(opacity=100);
opacity: 1.0;
border-top-color: silver;
border-top-style: solid;
border-top-width: 1px;
border-left-color: silver;
border-left-style: solid;
border-left-width: 1px;
border-right-color: silver;
border-right-style: solid;
border-right-width: 1px;
border-bottom-color: silver;
border-bottom-style: solid;
border-bottom-width: 1px;}

And this all works completely fine. I was wondering if I could do a fading transition effect while still only using CSS. Anyone?