I don’t know where I’ve been the last few months, but I’ve just discovered Script.aculo.us. It’s several JavaScript libraries that basically enable you to have nice visual effects without using Flash. Some of the examples on their site look really interesting.
I’ve updated the comment form on my site using these libraries. Now when you don’t fill in a mandatory field, it will let you know by highlighting the fields you missed and gently flashing an error message.
Each browser seems to handle this process a little differently. IE/PC doesn’t highlight the field or flash the text, but the text does show up. Safari doesn’t highlight the field, but it does flash the text. That’s because Safari doesn’t render borders on form fields. (Darn you, Apple!) Only Firefox does both correctly.
Beefing up the comment form is my first foray into using these libraries. I plan on using them in other areas of the site too, but don’t worry. I won’t be making things blink and slide unnecessarily. Also, because this is my first attempt at it, you may find something I’ve missed. If you find a bug or break the form, please how you broke it.
I made a mistake above. IE/PC does outline the form field. It still doesn’t flash the error message though.
Pretty nifty. I left my e-mail address out, just to check, and yes, it flashed. Will have to go check out that site.
One site that completely bowls me over for its use of Javascript (and Web design) is Slayer Office. Go to the linked page and click on “Favelet Suite”. Not only is his technique of combining a bunch of JS bookmarklets into one through the use of on-the-fly code fetches impressive (go back and re-parse that if you need to; it’s horrible), but many of the individual bookmarklets really astound. For example, just by adding JavaScript, you can turn any standards-compliant browser, or IE, into a poor man’s DOM explorer!
If you want to see how it’s all done, however, you have to sift through the code to find all the files he’s referencing and download them individually.