Get that cool Google-style ‘reveal’ effect on your site.
Go to http://google.com. See how certain elements are revealed only when you move your mouse? That’s über-cool in my book. I wanted the same for the main part of my site – but have the coding skills of a rhino. 🙁
Fortunately, my good friend Paul Lewis (@aerotwist) is a bit lot of a coding ninja. In fact, he’ll soon be packing his bags for Sweden to work for Fi, one of the foremost web design companies in the world. He took about 3.1 seconds to knock up the relevant scripts, etc.
So now, if you go to dougbelshaw.com you’ll notice that the bullet points fade in when you move the mouse. Classy. 😀
I’ve rewritten the README file included in the zip file below to make it more understandable by mere mortals, but you’ll still need to know your way around HTML. I’ll do my best to help if you get stuck and add a comment below, but I’m making no promises!
Not sure it’s working right. I see the sidebar appear for about 1 second and then disappear, to be replaced by the large bold icons (that can open like drop downs). But it’s so fast, i didn’t see that it didn’t look like a fade in. Is the a variable that you can use to set the duration of the fade in/out?
Steve, it’s not in this blog it’s on my profile page at
http://dougbelshaw.com! :-)
Oh, that is cool. Thanks for sharing! Will steal.
Good! That’s what it’s there for! :-)