2016-09-20 4 views
0

Здесь я использую http://specious.github.io/cloud9carousel/ слайдер, Я бы хотел добавить активный класс, когда изображение вращается на передней стороне.Jquery Animation cloud9 carousel добавить активный класс

+2

Не могли бы вы добавить образец того, что вы пробовали до сих пор? –

+0

У меня есть этот плагин, но я не могу видеть активный класс, , поэтому я хочу сделать css, изображение которого обращено на переднюю сторону, –

ответ

0

вы можете добавить «onRendered» функция обратного вызова я использовал его и работает для меня

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'); 
     } 
1

По многочисленным просьбам, в версии 2.2.0, обеспечивая имя класса по вашему выбору через frontItemClass собственности automatically tags самой передней пункт:

var carousel = $("#carousel") 

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

Живая demo на JS Bin.

Смежные вопросы