Наведение курсора на мышь

Question

Мне было интересно, знает ли кто-нибудь, как работает плагин Cycle.

jQuery(function($){ 
    $(".slides").cycle({ 
     fx:  'fade', 
     speed: 450, 
     timeout: 5, 
     startingSlide: 0, 
    }).cycle("pause"); 

    // Pause & play on hover 
    $(".slideshow-block").mouseover(function() { 
    $(this).find(".slides").addClass('active').cycle('resume'); 
    }).mouseout(function(){ 
    $(this).find(".slides").removeClass('active').cycle('pause'); 
}); 

}); 

Есть ли способ, чтобы перезапустить «слайд-шоу» замирания к первому изображению на отведении указателя мыши (вместо паузы)?

Я нашел этот код, но он не работает для меня.

$(this).find('.slides').removeClass('active').cycle('stop').cycle({ 
    startingSlide: 0 
}); 

Вот мои jsfiddle

Заранее спасибо за любую помощь с этим!

Answer 1

ОБНОВЛЕНИЕ:

Хорошо, игнорируйте все ниже. Я нашел решение на странице часто задаваемых вопросов плагина.

Функция .cycle может принимать целочисленный аргумент, который устанавливает текущий слайд в переданный индекс.

$(this).find(".slides").removeClass('active').cycle('pause').cycle(0); 

http://jsfiddle.net/WetNoodles/Ly0jxgz6/7/

---

Это не выглядит, как это официально поддерживается, однако вы можете восстановить плагин цикла в вашей мыши из событий. (Кроме того, я изменил MouseOut к MouseLeave - это, казалось, более надежные результаты)

.mouseleave(function() { 
    $(this).find(".slides").removeClass('active').cycle('pause'); 
    buildCycle(); 
}); 

http://jsfiddle.net/Ly0jxgz6/2/

В качестве дополнительной записке, вы можете выяснить, какой слайд в настоящее время показывают данные функции JQuery в.

var currSlide = $('.slides').data('cycle.opts').currSlide 

Затем можно использовать команду «назад» на страницу с первым слайдом, но это выглядит, как если вы сделаете это, то переход анимация будет работать для каждого из них.