A common feature of many web sites is a slide show. They have become so common and so similar, that they are a yawn. There are literally thousands of plugins for slide shows. They all work pretty much the same, and bloat the pages. They are also BORING.
They all have the same boring features. Everyone uses the same boring effects. How about multiple sliders? Just more bloat, and more boring crappy pages. Spice it up with flash or video? That just adds crap to crap. You can't save a page by adding bloat.
So what we are going to do is a round element with an iris for our slider:
You can start here: Then close the iris Now Let's do a slide show:
The code is as simple as it gets:
Play with the Borders
Okay that is a little different. What else can we do? We can alter the look by playing with the borders like we do in this snippet: Border options for round slide shows
Round is Not the Only Alternate Shape
So let's take the next step and add some additional shapes using this snippet: Alternate Iris Shapes
Sliding Through the Shape
For presentation purposes, you might want to use a shape but actually just cycle through the images without using the Iris. The controlled slow slide looks difficult, but with sprites it is actually child's play if you do your slider this way
Closing the Slide Show
It might be the case where you want to end the slide show at some point. You can:
- End by displaying a default final image
- Just stop the rotation after a time limit or number of rotations
- Hide the slider
... OR ...
You can do something a little different with a dissolve of the slide show
A file with all the code used in this article and the supporting snippets is available for download here.
Try out the code and don't be afraid to experiment. Avoid the boring!
If you found this article helpful you might also be interested in: