2014-01-27 2 views
1

Итак, я пытаюсь создать карусель с помощью плагина Cycle2. Разница в этом заключается в том, что вместо того, чтобы просто циклически перемещаться вперед и назад при нажатии на следующую и предыдущую кнопку, она также начнет циклически перемещаться вперед и назад при наведении курсора на кнопки.jQuery Cycle2 reverse on hover

Я могу создать это поведение для следующей кнопки со следующим кодом, который приостанавливает карусель и возобновляет ее при следующем наведении курсора.

$('.cycle-slideshow').cycle('pause'); 

$('#next').hover(function() { 
    //mouse enter - Resume the slideshow 
    $('.cycle-slideshow').cycle('resume'); 
}, function() { 
    //mouse leave - Pause the slideshow 
    $('.cycle-slideshow').cycle('pause'); 
}); 

Я не могу понять, как изменить направление слайд-шоу на предыдущей кнопки парении. Есть идеи?

Любой ввод очень ценится. Заранее спасибо.

ответ

1

Предполагая, что .cycle('prev') не останавливает карусель. Если это произойдет, вам нужно будет приостановить его снова после каждого вызова .prev и по умолчанию оставить функцию мыши.

Попробуйте что-то вроде:

var intervalVar; 

$('#prev').hover(function() { 
    //mouse enter - Resume the slideshow 
    intervalVar = setInterval(function(){ 
     $('.cycle-slideshow').cycle('prev'); 
    },1000); 
}, function() { 
    //mouse leave - Pause the slideshow 
    clearInterval(intervalVar); 
}); 

Это предполагает, что вы цикл каждый 1 второй .. Вы бы изменить 1000, чтобы соответствовать однако многие миллисекунды вашей карусельного установлено значение перехода.

+1

Спасибо, это было на месте. – alexedwardjones