CSS is simply great - Steal the best ideas and solutions

This will be quick. My favorite designer recently rewamped his site, Stuff and Nonsense. I spotted a few obvious things that you can steal from the CSS but just realized a good UX idea over there. If you click a link on that site, a small effect happens emulating a button press. I think it can be useful on slow sites as an immediate after-click feedback to the user: "Hold on, we are working on your request".

Here is the code:


Beautiful huh?

CSS is simply great - Adding more power to the user with a few lines of code

I'm playing with a very plain user interface, a form where you can set some data about planning your next trip with your friends. I'm just playing ok? The form contains a few text input elements, selects and a textarea. Nothing special.

But recently I've seen a new CSS framework (will give you a link when I find her again, sorry) where all the textual input controls were styled so pointing to a label, a checkbox or even a text input fires the pointer device's cursor and style it to cursor: pointer. Hey its dumb, I thought at the first view. But hey, why not? I can do a click (and a number of things) on those elements so why not set a pointer style that calls your attention. Its just cool and gives more UX goodness to your forms.

But there is more. (Cos I'm an unstoppable style robot ninja? No. I have a little time to think cos I'm on vacation.) I think its an other good thing if you set the cursor's state to cursor:text after you clicked on a textual control so you can get a visual feedback eg. "Hey I'm a text control, type something into my belly".

Before I give you an example I want to warn you: THIS CODE WILL NOT WORK IN EVERY BROWSER! But in my opinion YOU CAN GIVE A SHIT ABOUT THAT!

Here is an example: