New jQuery Plug-in; Slide Presentation

Published Monday 22nd of March 2010

I'm trying to put together a little intro/demo for aFramework so I built this slide plug-in for jQuery.

Ultimately I didn't feel it was what I was after with the aFramework intro but perhaps someone will find it useful.

Run it on a container of a list of images with text and the plugin will slide through all the images, stopping on each to display all the paragraphs of text.

The HTML needs to be:

divcontainer
    ul
        li
the first step in the slide
            img
the image to be displayed in this step
            p
first paragraph of text to be displayed
            p
second paragraph of text...
        
lithe first step in the slide
            img
the image to be displayed in this step
            p
first paragraph of text to be displayed
            p
second paragraph of text...
        
lithe first step in the slide
            img
the image to be displayed in this step
            p
first paragraph of text to be displayed
            p
second paragraph of text...

And then simply run the plugin on the container and it'll do the rest. You can override the default width/height settings, their styling is only on a single class (.jquery-slide-presentation) so target your container's ID instead and you're gtg.

Have a look.

Tags
Comments
No comments

Bookmark this Article

  • del.icio.us
  • Digg
  • Furl
  • Google
  • Technorati
  • Ma.gnolia
  • Blinklist
  • Blogmarks
  • Rojo
  • Stumbleupon

Comments Closed

Comments for this article are closed.

Random jQuery Plug-ins

  • Live Validation

    Use this plug-in to add live validation to any form on your page. The plug-in indicates whether a form control is valid or not by switching between an...

    Details

  • Super Simple Tabs

    This is an extremely basic tabs-plugin which allows you to create tabbed content from the ever-so-common list of in-page-links. You can set the select...

    Details

  • Togglable DL

    Use this plug-in on your definition-lists (dl-elements) to allow the dd:s for a dt to be toggled when clicking the dt. Don't use it unless it's semant...

    Details

More Plug-ins

Recent Comments

  1. Andreas on "SleekPHP User Handling"

    Thank you for showing interest :) Were the docs en...

  2. ciptard on "SleekPHP User Handling"

    Ok, thank you

  3. Andreas on "SleekPHP User Handling"

    I might write a "getting started" article for Slee...

Page cached. Loaded in: 0.0141 second(s).
Last DB change: 2012-02-04 08:04:40
Last file change: 2011-10-03 07:42:35
Cache created: 2012-02-04 13:51:06