posted on:January 26, 2009
Easy Slider 15 The Easiest jQuery Plugin For Sliding Images and Content
Version 1.5 of my Easy Slider plugin for jQuery is here. This is one of the my rare scripts that make it to their second version.
All of the features here are result of your comments, so if you have more ideas, keep ‘em coming!
Note: in case you haven’t already, you might want to check out article about first version of this plugin.
This version features:
- auto slide
- continuous sliding
- "go to first" and "go to last" button
- hiding controls
- optional wrapping markup for control buttons
- vertical sliding
- multiple sliders on one page
Here are the things you can customize (with their default values)
prevId: 'prevBtn', prevText: 'Previous', nextId: 'nextBtn', nextText: 'Next', controlsShow: true, controlsBefore: '', controlsAfter: '', controlsFade: true, firstId: 'firstBtn', firstText: 'First', firstShow: false, lastId: 'lastBtn', lastText: 'Last', lastShow: false, vertical: false, speed: 800, auto: false, pause: 2000, continuous: false
I will explain new options:
By default set to true, but if set to false it will not add any controls. It can be used with auto scroll when you want to disable user interaction.
controlsBefore and controlsAfter
In case you want to add some additional markup to gain more control over buttons you can do so by using these parameters. Check out the demo where I use these options.
By default set to true. If set to false it will disable button hiding when slider reaches the end.
firstShow and lastShow
These parameters hide (or show) "go to first" and "go to last" buttons
This option enables auto sliding, Just set it to true.
This option is set in milliseconds and it represent the duration of each slide when plugin is set to auto sliding
If set to true clicking the next button when the slider reached the end will jump to the beginning (and vice-versa). Combining this option with auto (both set to true) you’ll get endless animation
I have prepared 5 demos, although I could have done zillions. Hopefully I will have the time to create more good demos as I continue to develop this plugin
- basic default non styled demo
- styled demo with default settings
- non styled demo with vertical scroll and visible "go to first" and "go to last" buttons
- styled demo with auto scroll and continuous sliding
- styled demo with multiple slider, image and content slider, with different settings (top one has auto slide while bottom one doesn’t)
I already have some ideas about next versions (play/pause buttons, numbered pagination…) but I would also like you to share any idea you might have.
Enjoyed the article?
Then don't miss our next one! Subscribe to our RSS feed or share it with your friends.
Comments (308 Comments)
Sorry, the comment form is closed at this time.