A carousel component for Ext JS 4.0.7

This component is a container for showing carousel. We add to this carousel the reflection for images. This version of carousel is based on Ext JS 4.0.7. This component is also based on a jquery component : CloudCarousel '1.0.5' <http://www.professorcloud.com>. For further information you would like to check this link : http://www.professorcloud.com/mainsite/carousel.htm

Here is an example for the use:

HTML mark-up :

 <div id="carousel-div"/>       
 <!-- Define left and right buttons. -->
 <input id="left-but"  type="button" value="Left"/> <input id="right-but" type="button" value="Right"/> 

<!-- Define elements to accept the alt and title text from the images. -->
 <p id="title-text"></p> <p id="alt-text"></p> 

The style may be like this one :

 #carousel-div{
      width:560px;
      height:400px;
      background:#000;
 }

Configuration options for the carousel :

 
 Ext.onReady(function() {
   Ext.createWidget('carousel',{
        id: 'carousel-id',
        xPos: 280,
        yPos: 80,
        FPS: 30,
        reflHeight: 56,
        reflGap:2,
        buttonLeft: 'left-but',
        buttonRight: 'right-but',
        altBox: 'alt-text',
        titleBox: 'title-text', 
        autoRotate: 'no',       
        renderTo: 'carousel-div'
    });
 });

You will get a view like this one :

This component is in google code : http://code.google.com/p/ext-js-carousel

For further information about the component check the wiki in the google code : http://code.google.com/p/ext-js-carousel/wiki/Introduction