Jquery Animation cloud9 carousel add active class

Question

Here I'm using http://specious.github.io/cloud9carousel/ slider, I would like to add active class when image rotate on front of side.

Answer 1

Due to popular demand, as of version 2.2.0, providing a classname of your choice via the frontItemClass property automatically tags the frontmost item:

var carousel = $("#carousel")

carousel.Cloud9Carousel({
  // ...
  frontItemClass: "active"
})

Live demo on JS Bin.

Answer 2

you can add "onRendered" callback function i used it and working for me

var showcase = $("#showcase")
var card = $("#showcase .card")
showcase.Cloud9Carousel( {
        yOrigin: 42,
        yRadius: 40,
        itemClass: "card",
        buttonLeft: $(".nav2.prev"),
        buttonRight: $(".nav2.next"),
        bringToFront: true,
        onRendered: showcaseUpdated,
        onLoaded: function() {
          showcase.css( 'visibility', 'visible' )
          showcase.css( 'display', 'none' )
          showcase.fadeIn( 1500 )
        }
      } )
      function showcaseUpdated( showcase ) {
        $(card).removeClass('active');
        var index = showcase.nearestIndex();
        $(showcase.items[index].element).addClass('active');
      }