IT / Web

One of the biggest tools in our toolbox lately is jQuery. Just about every site we create these days has at least one jQuery feature or plugin that we’re using. If you’ve read this far and your eyes haven’t rolled back in your head, then you most likely know what jQuery is and probably also know that there is no shortage of web pages and articles about jQuery. This is by no means a comprehensive look at using jQuery, but we thought we’d share some of the plugins we’ve found very useful.

Countdown Timer - this plugin makes it very easy to have a countdown clock on your site. We’ve used this quite a bit to count down to events, like a Night of Worship or the next KidStuf Live. We have even used it in a behind-the-scenes, invisible manner to kick off an action at a specific point in time using the callback methods.

• Plugin: http://plugins.jquery.com/project/countdown2
• Example: http://northpointonline.tv/

Slideshow / Cycle - a simple plugin that allows you to create a quick slideshow or cycle feature. There are some basic animation effects that can be configured as well. One of our main uses of it is as a revolving banner area on our home page to show featured events and announcements.

• Plugin: http://plugins.jquery.com/project/cycle
• Example: http://northpoint.org/

Table Sorter - sorts table columns based on pre-defined criteria and/or user action. You can configure it to default sort on a specific column, prohibit sorting on certain columns, etc. Very useful wherever you’re displaying tabular data.

• Plugin: http://plugins.jquery.com/project/tablesorter
• Example: http://goglobalx.org/go

Kwicks - menu animation feature that slides open columns in a menu with a nice effect.

• Plugin: http://plugins.jquery.com/project/kwicks
• Example: http://northpoint.org/ (Quick Links at the top of the page - effect shows as you hover over different columns)

Simple Modal - there are a lot of different light box plugins out there, and they all have pros and cons. This one is pretty simple to configure with CSS and allows any type of content in the modal dialog. We’re using it in several places.

• Plugin: http://plugins.jquery.com/project/SimpleModal
• Example: http://insidenorthpoint.org/groups/group-life-resources/video/ (click on one of the video thumbnails)

Form Validation - there are also a bunch of different plugins that facilitate client-side validation on forms. This one can be configured to do a whole lot, but we’ve found that keeping it to a minimum yields the most consistent results.

• Plugin: http://docs.jquery.com/Plugins/Validation
• Example: http://kidstuf.com/site/invite

Got jQuery?