Home / Components / Galleries & Slideshows / HTML5 Carousel Gallery FWD /

HTML5 Carousel Gallery FWD

66 purchases

FWDesign Galleries & Slideshows HTML5 Carousel Gallery FWD An amazing HTML5 Canvas Gallery XML driven Carousel with a tone of configuration options, runs on IOS (iPad, iPhone) or Android (e.g. Samsung Galaxy Tab etc). $12 http://www.flashcomponents.net/component/html5-canvas-carousel.html?ref=phils http://www.flashcomponents.nethttp://u1.flashcomponents.net/components/small/5947_1.png


By purchasing and downloading this license, you are entitled, as buyer, to use the product in ONE SINGLE NON-COMMERCIAL PROJECT ( website or other ... [+]

> View graphic table with full license features


buy now

Compatible browsers: IE9, IE10, Opera, Chrome, Safari

Software Version: HTML5, Other

Files Included : CSS, HTML, JavaScript JS, XML

Resposive Layout: Fluid

Knowledge Level Required: Basic

Product ID:F1205947



FWDesign avatar

Professional HTML5 JavaScript Photo Templates Professional WordPress Web Plugins & Themes


HTML5 Canvas Carousel Gallery FWD

This is a HTML5 Canvas XML Carousel presenting a 3D photo gallery in the shape of a carousel with tons of features. You can customize almost anything and it  is also optimized for mobile devices (Android and IOS mobile devices such as iPad2, iPad3, iPhone, Samsung Galaxy Tab etc). It not only runs on those devices but it acts like a native app, you can touch and drag/rotate the Carousel just as you would a native app. Please note that we have tested it on IOS (iPad2 and iPad3) and Android (Samsung Galaxy Tab) and the performance is really good especially on the iPad with IOS5 or higher (the canvas on this devices is hardware accelerated).

This HTML5 Canvas Carousel Gallery can have any image presented in any way you want: horizontal, vertical, oblique, also it has unique presets with pre-defined movements and presentations. You can also set the colors of the buttons, scrollbar preloaders border etc, basically the entire color and graphics theme can be modified. Moreover, all the buttons and scrollbar are optional.

All the options can be easily modified from the configuration XML file, therefore also the maintaining of the carousel it's much easier.

   Example for setting up the carousel:

JavaScript code: var cc = new CanvasCarousel("myCanvas", "load/config.xml");
HTML code:

The CanvasCarousel JavaScript class function needs just 2 arguments: the canvas id and the path to the XML file. In this way you can declare multiple instances, creating a new CanvasCarousel instance for every canvas, with a different id and even a different XML configuration if you wish.

A help file is attached to the download file explaining all configuration tags and installation. 

Carousel Features: 

  • XML driven
  • all the positions, sizes and theme colors can be changed inside the XML file.
  • supports any image files (png, jpg, gif).
  • set the component's canvas width and height.
  • set the carousel position on the canvas.
  • set the thumb width and height.
  • set the carousel radius on x, y and z axis.
  • set the carousel angle for horizontal, vertical or oblique presentation.
  • set the thumb border size and color .
  • tooltip thumb option, which is dynamic (following the mouse).
  • set the tooltip background color and the text size and color.
  • the buttons can be enabled or disabled (visible or not).
  • set the buttons colors.
  • the scrollbar can be enabled or disabled like the buttons.
  • set the scrollbar track and handler colors.
  • the buttons, scrollbar and slideshow preloader positions can be set to be anywhere.
  • the carousel can also be rotated with the mousewheel (can be disabled).
  • slide show option.
  • auto play option.
  • set the slideshow transition time (when set to autoplay).
  • it can open URLs when an image is clicked.
  • the performance of this product is so good that you can have multiple carousel instances set to auto-slide in the same page of your project or website. 
Many other cool features!

Similar HTML5 Galleries / Menus

HTML5 Canvas Cover Flow    HTML5 Dock Menu Gallery XML
For more cool galleries visit FWebDesign portfolio . This product is included in the package: FWD All Products Package. Read more about us on The Web Maker - Professional Responsive HTML5 JavaScript Templates and Galleries


buy now


Personal License By purchasing and downloading this license, you are entitled, as buyer, to use the product in ONE SINGLE NON-COMMERCIAL PROJECT ( website or other multimedia project not generating income ), your personal work or work for a client. You may not redistribute / resell the functionality provided with the purchased product without the author's and / or FlashComponents.net written permission, but you may modify its content. In case you want to use the product for a commercial project then you will have to buy the 'Commercial License'.

Usage Terms: Personal Commercial Multiple
Unlimited use in the same project
For your client's ONE SINGLE COMMERCIAL project
For your client's MULTIPLE COMMERCIAL projects

Other by FWDesign:

Royal 3D Carousel

HTML5 3D Carousel packed with tones of settings...[+]

More >>

Royal 3D Coverflow

Complete HTML5 Cover Flow solution.

More >>

Megazoom Image Viewer

The Megazoom plugin is a powerful, versatile, e...[+]

More >>

Related components:

Royal 3D Carousel

HTML5 3D Carousel packed with tones of settings...[+]

More >>

PURE - Responsive HTML5 PhotoTemplate

Pure HTML Template is a stylish template from ...[+]

More >>

Multimedia Banner Rotator ( Html5 / jQuery )

Professional multimedia gallery / banner rotato...[+]

More >>


Add comment

  • We have a flash version similar to this one.


    About ie8 if it would be possible we would create the same carousel to work on everything but this can only be done with html5, a fallback to flash or something else can be made with code, we sell the product but we can't implement this because it is different for each situation.

    #  /  PM  /  posted on May 26, 2012
  • Hello.

    I also had the "Error with the xmlfile: parsererror" message running just the index.html demo file on my workstation. I came here and read the suggestion and it worked for me via Firefox as explained.

    But I could not get this to work on my web server. I finally fixed it by turning off the compression of the folders that seems to have been created when I extracted the files from the zip. This compression was not on my Windows 7 machine. Only on the Windows 2008 server I was running this on. I am not sure what about the zip created the compression on the server, other than the zip was created with a Mac.

    Everything works wonderfully now.

    Thanks and great job!

    #  /  PM  /  posted on Jul 11, 2012
  • Great.

    This has never happened to us but good thing you solved it!


    #  /  PM  /  posted on Jul 11, 2012
  • Hello.

    I am having a problem running 2 FWDesign items on the same page. The Carousel and the Dock menu. They each run perfectly...when separate...but get errors when running on the same page together. Please check your PM's or advise another way to ask a question about this problem.

    Thank you.

    #  /  PM  /  posted on Jul 27, 2012
  • It does'nt work in IE8

    #  /  PM  /  posted on Jan 07, 2013
  • Dear FWDesign,

    I recently bought your carousel. It works great on any computer where I tested it (chrome, safari and firefox). However, the same page is not loaded properly on the ipad2 (safari browser).

    Could you please help me on this issue?

    Thank you.

    #  /  PM  /  posted on Feb 19, 2013
  • Hi.

    I think you have an older IOS operating system, update the IOS to the latest version and it will work great.

    Best regards.

    #  /  PM  /  posted on Feb 19, 2013
  • Is there a setting to have the revolving images move continuously without stopping? And also a speed setting for that?

    How about a "target" attribute for the links?

    #  /  PM  /  posted on Aug 18, 2013
Please login to post comments.