Spice Up Your Blog With 7 jQuery Goodies

You invested a great deal of time and effort into getting your website ready for the world to view. While content is definitely the most important thing, a little eye candy never hurt either. Rather than gambling with proprietary plugins like Flash player, it is better to use tools that every browser on every device supports. Javascript is an excellent scripting choice, and jQuery is a remarkable javascript tool that makes it easy to add animations, effects, and superior functionality.

1. Kwicks

Kwicks is a easy-to-use tool that presents options, usually from a menu, in a very attractive way. Images are stacked on top of each other with the lower ones only partly showing. Move your mouse over a lower image, and the others slide out of the way to reveal it. This tool, a port of the Mootools script by the same name, is a great way to add a little pizazz and has now made an appearance on many websites.

2. Tabs

An advantage of javascript is the ability to load portions of pages without having to reload the entire thing. This is particularly useful when navigating through a lot of text or images. If most of the page stays the same, using tabs to only change the relevant data helps reduce load on your site. Flowplayer is a jQuery tabs technique that is smooth and quick. Clicking through the different tabs feels as natural as it would on a desktop program.

3. Facebox

Modal windows have been around for a while in various forms (lightbox, shadowbox, etc). Facebox is an attempt to provide a Facebook-like modal window for website owners. With CSS3, the modal popup has a drop shadow, rounded corners, and a transparent border. Of course, you can customize the appearance however you like. To create the contents, you can use a separate file or a hidden DIV within the current file.

4. Beautiful Background navigation menu

This move menu transition for jQuery makes it fun to navigate through a website. Move your mouse over a menu category, and the background flips to another image like a page turning in a photo book. The full instructions are included, with sample CSS and HTML to help you get started. The demo is stunning, and your menu will be too with this script.

5. Galleriffic photo gallery

You cannot talk about jQuery and at least mention one photo gallery. I have seen many, but Galleriffic is terrific. Features include smooth image transition fading, optional thumbnail highlighting, slideshow playing, and captions. This type of gallery is good for occasional portfolios rather than ongoing collections, since it does not have any image manipulation or thumbnail generation. Nevertheless, it is stunning, and if you like it enough, you can integrate it into a gallery script.

6. Scrolling background

This jQuery script probably does not provide any needed functionality, but it is super cool. With it you can make your background scroll. You really have to see the example to see how nice it looks, and you may want to include the ability to disable it for site visitors who are easily annoyed. Nevertheless, for first impressions, it is a nice feature to have.

7.Scrollable content

This scrollable content script is similar to the generic tabs one with the addition of a sliding animation and the ability to use the mouse scroll wheel (or multi-touch capabilities) to slide through each one. With this script, you can also make a section within your site vertically scrollable, or even setup a complete navigation system that relies on the user’s keyboard arrow keys to navigate through each section. Our UK server hosting specialists at 34SP.com love the functionality this script adds to websites.

There are boat loads of other jQuery scripts and plugins freely available on the web, and many websites have covered them extensively. Most tutorials include demos so you can try them out before decide to use them. With a little help from jQuery, your site add that much needed bit of sparkle without giving you or your users headaches.

 

Comments

  1. Excellent list, very useful!

Speak Your Mind

*

Current ye@r *