Blockster is a Javascript transition effect designed for 'featured content' rotators or slideshows. Its underlying concept is to transition between one element to the next block by block. It is highly customisable in terms of how many blocks are involved, whether they fade in or simply appear, whether they appear in order or randomly, and more.
For demos and full info, see http://mitya.co.uk/scripts/Blockster-transition-effect-122
It requires that you have a holder DIV to house your slides, also DIVs. All should be given fixed widths (even the slides - don't give these width & height 100%).
The rotation is started by calling
blockster(params)...where params is an object of property/value pairings from the following:
- holder(string, default: null) - a string to be used as a jQuery selector pointing to the holder element that contains the slides
- rows(int, default: 10) - the number of rows for the block grid
- cols(int, default: 10) - the number of columns for the block grid
- pause(int, default: 3500) - the number of miliseconds to wait (i.e. show the slides) between transitions
- animType(string, default: 'fade') - either 'simple' or 'fade'. If the former, blocks simply appear. If 'fade', they fade in.
- random(bool, default: false) - if true, blocks will appear/fade-in in random order
- blockAnimSpeed(int, default: 50) - the number of miliseconds between each block appearing/fading in