Thursday, December 27th, 2007

jQuery Glider Component

Category: Component, jQuery

The nice folks over at Dynamic Drive have created a new jQuery plugin that lets you turn ordinary pieces of HTML content on your page into an interactive, “glide in” slideshow, with several
configurable options:

This script lets you painlessly showcase new or featured contents on your page, by turning ordinary pieces of HTML content into an interactive, “glide in” slideshow. For the ultimate in the
ability to customize its look, the pagination links are also ordinary links that you define on the page, but with special CSS class names inserted when it should perform a certain task (ie: “toc” class if it’s a pagination link). This means the pagination links can be styled and arranged any way you like. The script enlists the help of the jQuery library for its engine. Lets see a rundown of the script’s features now:

  • Both the contents to show as part of the glider plus the pagination links used to toggle them
    are created from ordinary HTML content on the page. The pagination links can
    be styled, arranged, even selectively removed anyway you like.
  • Pagination interface is gently faded into view.
  • Supports two different display modes- “manual” and “slideshow.”
    In slideshow mode, the glider automatically rotates the contents until the user
    explicitly clicks on one of the pagination links to view a particular content.
  • With slideshow mode, specify optional number of cycles glider should go
    through in slideshow mode before it stops.
  • Ability to configure the “glide in” duration (in milliseconds), such as 1
    second, 600 milliseconds etc.
  • Optional persistence feature to remember and recall the last content
    viewed by the user when they return to the page within the same browser
    session (session only cookies).
  • Multiple Featured Content Sliders per page supported.

The site has all of the details for setting up the content with simple CSS classes, init script, and such.

jQuery Glider

Posted by Dion Almaer at 5:42 am

2.9 rating from 38 votes


Comments feed TrackBack URI

a cool lib

Comment by blankyao — December 27, 2007

It seems like it’d be much more intuitive for “back” to slide down rather than up. Maybe it’s configurable and I didn’t notice.

Comment by Andrew Clarke — December 28, 2007

yes , jquery seems fast since this last version. i like the second example.

Comment by mountlaurel — January 10, 2008

Leave a comment

You must be logged in to post a comment.