Simple Fade effect with CSS3
See the CSS code:
transition: opacity .25s ease-in-out;
-moz-transition: opacity .25s ease-in-out;
-webkit-transition: opacity .25s ease-in-out;
Now use this class in anything on which you want to create this fade effect.
<p class=”fade”>This is my text element that will fade when you hover over it.</p>
I have used this in the paragraph as you can see above. Now Hover over the paragraph with fade class and see the effect.
Demo: take the mouse over the paragraph below
This is my text element that will fade when you hover over it.
You can also use this on the image by using class=”fade”
as in this
<img src=”imageurl” alt=”” width=”200″ height=”150″ class=”fade” />
Take the mouse over the image to see the effect.