2012-10-04 3 views
3

외부 컨트롤을 사용하여 jcarousel을 설정했습니다. 내 'controls'-list에'mouseover '링크가 있으면 회전식 캐 러셀이 해당 이미지로 스크롤됩니다.stop() jcarousel 스크롤 애니메이션

지금까지 모든 것이 잘 작동하지만 다른 '컨트롤'링크를 빠르게 마우스 오버 할 때 첫 번째 링크에서 멈추어 스크롤 애니메이션이 끝나기를 기다립니다.

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

확실치 않지만이 문제를 해결하기 위해 'mouseover'에서 실행중인 스크롤 애니메이션을 중단해야한다고 생각합니다.

carousel.stop(true); 

과 :

carousel.scroll.stop(true); 

이 사람이 나를 도와 줄 수

나는이 라인 (작동하지 않는) 시도? 아마도 쉬운 해결책이있을 수 있지만 일반적으로 jQuery 나 프로그래밍에 익숙하지 않습니다.

답변

4

같은 문제가있었습니다. 아주 간단한 해결책을 찾았습니다.

$('#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 
    }); 

(내가 가지고 또한 자동 스크롤)처럼 보이는 링크 //이

/** 
* 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) 
}, 

내 // 스크롤 후 "jquery.jcarousel.js"에

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

를 넣어 어쩌면 누군가가 유용하다고 생각할 것입니다!

2

특정 div에 마우스를 올려 놓았을 때 특정 이미지를 표시하는 jCarousel 컨트롤을 사용하여 비슷한 컨트롤을 사용할 수 있습니다. 스크롤 애니메이션이 이미 재생되고있는 경우 회전식 캐롤라이나가 새로운 대상을 만들지 않는 문제도있었습니다. 알고 보니, 내가 현재 재생중인 애니메이션을 중지하는 데 필요한 모든 난 그냥 새 대상을 지정하기 전에이라고

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

다음 코드를했다 ... 그리고 그것은 내 문제를 해결했다. 이게 도움이 되길 바란다.

+0

이렇게하면 캐 러셀이 중지되지만 초기 상태로 재설정됩니다. 현 상태에서만 멈추고 떠나는 법을 아십니까? – Flaudre