Reputation: 154
Here I'm using http://specious.github.io/cloud9carousel/ slider, I would like to add active class when image rotate on front of side.
Upvotes: 0
Views: 785
Reputation: 178
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.
Upvotes: 1
Reputation: 1
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');
}
Upvotes: 0