Creation: 14/07/2009 18:18
Last Modification: 18/07/2009 17:56
In a website, it is sometimes usefull to set the opacity of an element.
Problem is, Internet explorer and firefox don't handle this the same way.
Here is a solution to have both firefox and Internet explorer setting the opacity of an element.
Firefox has a standard option name opacity.
You can use this one to set and element opacity
(from 0 to 1, 1 meaning full opacity).
Internet explorer does not handle the opacity option.
To set the opacity you will have to use the alpha filter.
This will give alpha(opacity=20) where the value is an
integer between 0 and 100.
You can add the following to an html page:
<style>
a.opac {
filter: "alpha(opacity=100)";
opacity: 1;
}
a.opac:hover {
filter: "alpha(opacity=20)";
opacity: 0.2;
}
</style>
<a href="http://www.netbertrand.com" class=opac>Opacity link</a>
And you will have the following result:
This will create a link and change the opacity when mouse is over.
