Make fading out using css3
I will teach easy tutorial how to make your page / blog fading out using css3.
First step type on your css :
@-webkit-keyframes FadingOut { 0% { opacity:0; } 100% {opacity:1; } }
@-moz-keyframes FadingOut { 0% { opacity:0; filter: alpha(opacity=0);} 100% {opacity:1; filter: alpha(opacity=100); } }
@-o-keyframes FadingOut { 0% { opacity:0; } 100% {opacity:1; } }
@keyframes FadingOut { 0% { opacity:0; filter: alpha(opacity=0);} 100% {opacity:1; filter: alpha(opacity=100); } }
and add html css like :
html { -webkit-animation: FadingOut 2s; -moz-animation: FadingOut 2s; -ms-animation: FadingOut 2s;}
Example click here
Labels:
animation,
css3,
fade,
fade out,
fading,
fading out,
opacity,
transition

0 comments:
Post a Comment