Canvas slideshow

Posted 2011-10-02

HTML 5, canvas based, slideshow is simplified version of flash slideshow used on this site (and direct port of I Can Create header). All internal configuration is stored in xml file. To use it, you just have to call:

		  DestID: 'slideshow',
		  loader: 'imgs/loader.gif'

if you want to handle case when canvas can not be used, just define noCanvasCallback. Of course there are few more variables:

  • DestID - div where canvas will be created/canvas id
  • noCanvasCallback - called when canvas can't be used
  • width - canvas width
  • height - canvas height
  • images - path to xml
  • bgcolor - canvas background color
  • loader - animated loading gif

Other variables can be defined in XML:


  • displayTime - how long image will be displayed
  • fadeFactor - fade modifier (larger it is, faster image will crossfade)
  • images - paths to images

To download it click here. Slideshow requires jQuery.