CSS Animation on Hover

For this video, “CSS3 Animation on HoverCSS Animation on Hover,” the sample file is called “basicVerticalSliderBasic101.html.”  It has an attached css style file in the same folder.  When you open the html file, you should have direct access to the CSS for this video, “CSS Animation on Hover.”

 Animation on Hover is just so much fun. It’s one thing to use the CSS hover option, that was cool back in the day. But now, if your stuff don’t fade in or hover, you ain’t got job. If you go to my main site, sillybilly.com or even look around this site, then you can see that I have lots of work to do when it comes to Animation on Hover.

Hopefully you have watched the preceding videos that cover CSS3 Opacity and RGBA as well as the Introduction to CSS3 Animation. If you have seen those, then you are ready to move ahead and use those concepts to make some fun things happen. If you have not seen those videos yet I strongly suggest you take the 10 minutes it will cost you to view them both and look at the code in the sample files that comes with both. Please.

To move along with Animation on Hover, it will blow your mind how we get this done. It is kind of strange and has to grow on you a bit. I’m a Flash guy ( or used to be a Flash guy ) and animating in Flash was a great joy. Even animating with code was fun. But with CSS Animation on Hover, the code is a bit different, and it took me a while to let it sink into my brain. You are most likely a lot more bright than I am so you most likely will not have the problems I encountered as I tried to understand CSS Animation on Hover.

Project Main PageCSS Animation on Hover I have found all comes down to, “Where do we start and where are we going?” Of course, with that question, the bigger question is, “Where do you put the code?”

See the Video