CSS: Opacity hover effect

0
hi folks , today i gonna show you a effect of css3 which is called opacity

ok lets learn it


ok to work with css first we need to assign a class or division to it so, lets do it now for example

PHP Code:
<class="test"this is a test </p

ok now lets target it with css3 ,

to do it type the following code
PHP Code:
#test:hoveropacity:0.5; 


now #test here = your class that you assigned
now opacity in css is described in decimals of 1

for example 0.7 = 70%

now css3 does not work in IE 9 or lower

to fix that

type in following to the end..

PHP Code:
filteralpha(opacity=50);
/* for IE 9 or lower only*/ 

now when you hover the mouse over the paragraph , it will reduce the opacity to 50 %


hope this helped you Wink
[Image: An9XX.gif]

    CSS: Opacity hover effect
İlginizi çekebilir:
  • CSS: Transform hover effect