SlideItMoo 1.1 - improved image slider

SlideItMoo 1.1 - improved image slider

The same idea as the one from v1.0. Some new things added.
Prerequisites for this example:

  1. MooTools 1.2 core and MooTools 1.2 more - visit mootools.net
  2. * Slimbox 1.65 - visit homepage

Tested on:

  • IE 7
  • Firefox 2, Firefox 3
  • Google Chrome
  • Opera 9.5

Changes:

  1. added continuous navigation
  2. elements are selected based on CSS selector
  3. for banners (but not only if you use autoslide for thumbnails display) added direction control (-1: enter from left; 1: enter from right)
  4. mouse wheel navigation is optional (default disabled)
  5. added effect duration as parameter ( when autoslide is enabled, the duration between slides is the sum of the effect duration and the slide duration )

Updates ( August 4'th 2009):

  1. new parameter elemsSlide. If you want your slider to navigate multiple elements when forward/back buttons cliked, set this to the number of elements you want it to slide at once

Demo 1 - thumbnails slider, div containers:
Use the forward - back buttons.

1: Address Nam porta tellus ac urna
2: Ads Praesent pellentesque eros nec nisl
3: Calendar Vestibulum eleifend scelerisque purus
4: Comment Felis nulla iaculis lacus
5: Home Quisque neque. Donec quam ante, pulvinar vitae
6: Mail Suspendisse sodales turpis. Aliquam lectus
7: News Praesent pellentesque eros nec nisl
8: RSS Nam porta tellus ac urna
9: Search Praesent pellentesque eros nec nisl
10: Sign Vestibulum eleifend scelerisque purus
icons from Smashing Magazine

Demo 2 - banner rotator, enter from left:
On mouse over the slider stops. In can enter from right too. It takes only a parameter to do so.
Remember to set a CSS class on the banners to be used as selector.

Demo 3 - informative banner rotator, enter from right:

Chained drop down boxes, the neat way

Ever had a problem displaying the relationships of hierarchical data? Tons of drop downs displaying data according to what the user selected? Not any more. ChainedSelect comes to your aid with a neat display of your data. Easy to use and to implement. more details

MooTools and SiFR - cool, antialiased text

Tired of the same boring look of your text? With the help of this script, your titles will look neat! Try it out. more details

MooHover - cool looking links and buttons

How about some cool hover effects on your links and buttons? You want it? You got it! more details

MooTools image zoom

Got really large images that your client wants you to use? No room in the page for them? Need a solution? Got one! Go get it tiger! more details

*It is not neccesary to use Slimbox to dislplay the full image. You can use other Lightbox script written with MooTools 1.2 or write your own.

Quick links: Useful plugins: Have you found this useful? Support it by donating.