Free Image gallery slider based on jquery

SlideItMoo is a MooTools 1.2 JavaScript plugin for sliding images, browser friendly and nicely degradable. All CSS styling is external. The plugin can slide the images from your photo gallery either by clicking the back – forward buttons or by mouse wheel.

It can be used to display any number of thumbnails in a photo gallery or as a banner rotator. To switch from one way to the other, you simply have to set the appropriate values when instantiating the class.

There are several options inside the plugin that you can set up in order to obtain the desired effect:

  • visible: number of visible images ( default:5 )
  • showControls: either to show the back-forward buttons ( default: 1 )
  • autoSlide : automatically slide the images from your photo gallery ( in milliseconds to set the interval – default:0 )
  • transition: the transition you want to use when sliding
  • currentElement: the element currently selected. If you need to start the slider with a specific image, set this with the image number-1 ( default:0 )
  • thumbsContainer: the id of the thumbnails/images container
  • elementScrolled: the id of the container of thumbsContainer variable
  • overallContainer: the id of the elementScrolled variable

he CSS styling behind all this is very simple; the only thing you need to remember is to put on the thumbnails/banners container the whitespace:nowrap property. Besides that, you can use your own id?s in your html and then provide them when you instantiate the class.

To view an online example click here.
Here are the SlideItMoo image slider source files.

Leave a Comment.