Video icon 64
Learning to code? Skill up faster with our practical video courses. Start your free trial today.
Advertisement

20 More Excellent AJAX Effects You Should Know

by

Back in October we wowed you with 20 Excellent Ajax Effects You Should Know. The post went on to become one of the most popular ever published at Nettuts+. This time around we have twenty more equally excellent Ajax effects for you to know and love.

1. Image Menu

The Image Menu is a simple piece of JavaScript that uses images to make a horizontal image menu. When you hover over the links, the image expands and shows the rest of the image. It's compatible with nearly all modern browsers (no word on IE 8).

2. ImageFlow

ImageFlow is an unobtrusive and "user friendly" JavaScript image gallery script. It features an elegant scroll-bar to browse through the images, and all of the images sit on top of a reflection, creating a Mac-like coverflow effect.

3. Instant.js

If you're looking to add some interesting backgrounds, rotations and other effects to images, Instant.js might be just what you're looking for. The JavaScript degrades gracefully, so browsers who don't have JavaScript enabled won't notice a difference.

4. Glassbox

We've all heard of Lightboxes and even Greyboxes, but how about GlassBoxes? GlassBox is an interface library that relies Scriptaculous and Prototype. The nifty library will add lucent borders and other flash-like effects. It's easy to use, skinnable and even has dynamic content loading.

5. Search Field CSS/JS

Auto-completing search fields are highly valuable when it comes user interaction. Sometimes the searcher doesn't know quite what he's looking for, so anything that helps the user find exactly what he wants is a huge benefit.

CSSGlobe has a very nice tutorial on how to enhance your site's searchfield (unobtrusively, no less) with a bit of CSS and Ajax.

6. Protoload

Loading images and fields are important to modern web applications that use Ajax. Protoload gives some built in options to help show the user what's going on while she's waiting. The script gives many options like color overlays for loading elements, custom text, and many other options.

7. jwysiwyg

jwysiwyg is a simple, powerful and extremely lightweight JavaScript jQuery WYSIWYG plugin. The plugin has many of the standard features of WYSIWYG editors, and is only 7kb in total size.

8. jquery.biggerlink 2

Bigger link 2 is really a simple plugin that makes bigger, clickable links easier. It even allows you to embed links inside of linked elements, if that makes sense. (Check out the demos for more clarity.)

Bigger Link 2 runs on the popular jQuery JavaScript framework.

9. jQuery Tag Suggestion

Tag suggestions are a popular usage of Ajax in modern web applications. Much like auto-completing search boxes, the jQuery Tag Suggestion plugin is an easy to use plugin that gives any application that uses tagging a way to quickly find the proper tag. A simple yet effective boost in the user experience.

10. Facebox

Facebox is a unique lightbox script that mimics the lightbox style of Facebook's modal windows. Built on jQuery, Facebox looks and feels almost exactly like Facebook's interface, and it's simple to install as well.

11. Humanized Messages

Humanized Messages is a nifty jQuery plugin that does as the name implies: it creates a friendly messages for the user. The JavaScript plugin does this by creating a translucent message over the screen, and gently fades away over time.

12. LightWindow v2.0

LightWindow is yet another Lightbox plugin, but it adds some functionality that plugins of it's type seem to leave out. For starters, the plugin allows for rending and using multmedia within the lightboxes. Movies, images, even entire galleries can be shown within the LightWindow. Perfect for unobtrusively showcasing multimedia.

13. Unobtrusive Table Actions

Table data is often hard to display effectively, especially when you want to allow sorting of the rows and columns. The Unobtrusive Table Actions is a JavaScript that allows for different effects to be placed on table data. Highlighting rows, columns, sorting data, and much more can be done with the aide of this little script.

14. jQuery checkbox

jQuery checkbox adds a little flair to checkbox fields in forms. It adds a toggle button very similar to that of the iPhone interface, giving a very distinctive on or off. It's great for usability, and the dynamic skin can be turned on or off, on the fly.

15. iCarousel

Carousels are a great way to rotate content such as images or news stories. The iCarousel plugin fits the bill as a simple, tiny script that gives all sorts of configuration options and usages. News tickers, photo carousels or even an ad carousel.

16. MochaUI

MochaUI is another UI library for the JavaScript framework MooTools. MochaUI essentially builds an entire user interface for Web sites, forms and widgets. It includes a file browser, window resizer, paneled layouts, tabbed layouts, and much more.

17. jTip

jTip is a simple concept, yet very effective for improving hovertip functionality. Based on jQuery, jTip simply adds an elegant hoverbox to pre-configured links on a page, all with the help of some Ajax.

18.Uni-Form

Forms have long been the troublespot for many web developers over the years, and technologies like Ajax have greatly helped the user experience. With Ajax, you can process forms in real-time, validate them and send responses without requiring a reload of the page. Uni-Form is a little Ajax script that is a plug-in-play concept that tries to standardize form markup with XHTML and modularize the form, so that individual elements can be easily added or removed.

19. Validation Hints

Validation Hints is a simple script that aides in form validation. It makes sure that password and username fields are the specified length, and can even validate against regular expressions. Small and handy.

20. Control Tabs

Control Tabs, (part of the robust LivePipe UI), is a sweet script that gives many different ways to configure tabs on a page. You can use the standard tabbed interface, or even use something like images to show tabs as well. Control Tabs is a robust script, and even has an API that you can use to fine-tune your tabbed interfaces.

Advertisement