Slicebox is a great slideshow from the guys at codrops.
http://tympanus.net/codrops/2011/09/05/slicebox-3d-image-slider/
It uses CSS3, HTML5 and jQuery to create the most stunning effects on a slideshow to date.
However, there are a couple of little details that have been missed, for example, I wanted to automatically display the description of each slide, negating the need for the user to click the info icon.
Here is how i did it:
This hinges on the function
_showInfo();
Open up jquery.slicebox.js found in the js folder.
1) We want to display the very first title info, so scroll down to line 235. Which is within
_initEvents
. add the following line:
instance._showInfo();
2) Under
_showInfo
(line 244 before you made any changes) comment out
this._stopSlideshow();
by using a double forward slash.
//this._stopSlideshow();
3) Under
navigate
, (line 327 before you made any changes), change from:
this._rotateBox( dir, options );
to
this._rotateBox( dir, options, function() {
instance._showInfo();
} );
Finally, compress your code, you could use http://jscompress.com/, and save the changes to jquery.slicebox.min.js
Hope that saves you a bit of time if you were fortunate enough to stumble across this little post 🙂
