Как остановить () анимацию прокрутки jcarousel

Я настроил jcarousel с внешними элементами управления. Когда я «нахожу» ссылку в моем списке «элементов управления», карусель прокручивается до соответствующего изображения.

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

// SCROLL TO LINK
$('#controls a').on('mouseover',function() {
var opt = $('#controls a').index(this)+1; 
carousel.scroll($.jcarousel.intval(opt)); 
});

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

Я пробовал эти строки (которые НЕ работают):

carousel.stop(true);

и:

carousel.scroll.stop(true);

Может ли кто-нибудь помочь мне с этим? Вероятно, есть простое решение, но у меня нет опыта работы с jQuery или программированием в целом.


jquery jcarousel
person dahannes    schedule 04.10.2012    source источник

Ответы (3)


arrow_upward
5
arrow_downward

Была такая же проблема. Нашел очень простое решение. Поместите его в "jquery.jcarousel.js"

/**
 * Stop animates the carousel, jump To End (animate Slide).
 *
 * @method animate
 * @return undefined
*/
stopAnimate: function() {
this.list.stop(true,true,true);
},

после этого

 /**
 * Animates the carousel to a certain position.
 *
 * @method animate
 * @return undefined
 * @param p {Number} Position to scroll to.
 * @param a {Boolean} Flag indicating whether to perform animation.
 */
animate: function(p, a) {
    -/-/-/-/(several strings)
},

моя //прокрутка к ссылке// выглядит так (у меня есть дополнительная автопрокрутка)

$('#controls a').hover(function() {
        var opt = $("#controls a").index(this) + 1;
        carousel.scroll(opt);
        carousel.stopAuto();//autoScroll Stop
    }, function() {
        carousel.stopAnimate(); //! here is located our function
        carousel.startAuto();//autoScroll Start
    });

Может кому пригодится!

person Ocean    schedule 10.12.2012

arrow_upward
2
arrow_downward

У меня есть аналогичный элемент управления, использующий элемент управления jCarousel, который показывает определенное изображение, когда я навожу мышь на определенные элементы div. У меня также была проблема, когда, если анимация прокрутки уже воспроизводилась, карусель никогда не добиралась до новой цели. Оказывается, все, что мне нужно было, чтобы остановить воспроизводимую в данный момент анимацию, это следующий код...

$(.jcarousel).jcarousel('list').finish();

Я вызвал это как раз перед тем, как указать новую цель, и это решило мою проблему. Надеюсь, это поможет.

person Wade    schedule 17.01.2014
comment
это остановит карусель, но также сбросит ее в исходное состояние. Любая идея, как только остановиться и оставить в текущем состоянии? - person Flaudre; 27.02.2017

arrow_upward
0
arrow_downward

из https://sorgalla.com/jcarousel/docs/plugins/autoscroll/reference/api.html:

Запускает автопрокрутку:

$('.jcarousel').jcarouselAutoscroll('start');

Останавливает автопрокрутку:

$('.jcarousel').jcarouselAutoscroll('stop');

Надеюсь, это поможет.

person Mike D3ViD Tyson    schedule 27.01.2020