2009-09-23 6 views
0
$('.rotateme').cycle({fx:'fade',speed:2500,timeout:3000,next:'#arrowright',prev:'#arrowleft',sync:1,pause:1}); 

하이 다이 디 (Hai dudes), 위의 코드는 이미지가 주기적으로 흐려지는 (명백한) 이미지 슬라이더에 사용하고 있습니다. 그것은 li 요소를 순환 때jQuery 순환 페이드 순서 변경

, 이전 버튼을 그냥 페이드 아웃 한 li 요소에 저를 반환 한 다음 목록 아래로 계속 :

어쨌든,이 일어나는 것이다.

내가 일어나고 싶은 것 :

내가 이전 버튼 이전 요소에 저를 돌아 방향을 반대로하고 싶은, 그래서 올라갈 것 대신 다시 목록 추락하지만,되지 않을 것이다.

rev:   0,  // causes animations to transition in reverse 

이 정도 작동하고 여기서 실패가 :

확실한 솔루션은 #arrowright에 대한 별도의 바인딩을 사용하는 것입니다 내가 다시 #arrowright을 클릭하면, 다시 방향을 반대로한다 (DOH)의 의미 그 #arrowright 실제로 토글 버튼이며 그 필요하지 않습니다 ...

어떤 제안?

답변

1

//이 스 니펫은 'selectedarrow'에 'selected'클래스를 추가하고 'arrowarrow '에서'selected '클래스를 제거합니다. 그런 다음 .cycle()을 실행하면 "#arrowRight"에 'selected'클래스가 있는지 확인하고, 맞으면 rev : 0 변수없이 .cycle()이 실행됩니다. 그렇지 않으면 정상적으로 되돌아갑니다. 사용자가 "#leftArrow"를 클릭하면 'selected'클래스가 제거됩니다.

if($("#arrowRight").hasClass("selected")) { 

$('.rotateme').cycle({ 
    fx:'fade', 

    speed:2500, 
    timeout:3000, 
    next:'#arrowright', 
    prev:'#arrowleft', 
    sync:1,pause:1 

}); 
} 


else{ 
$('.rotateme').cycle({ 
    fx:'fade', 

    speed:2500, 
    timeout:3000, 
    next:'#arrowright', 
    prev:'#arrowleft', 
    sync:1,pause:1 
    rev: 0 
}); 
} 


$("#arrowRight").click({ 
    $(this).addClass({"selected"}); 
    $("#arrowLeft").removeClass({"selected"}); 
}); 


$("#arrowLeft").click({ 
    $(this).addClass({"selected"}); 
    $("#arrowRight").removeClass({"selected"}); 
}); 
+0

부탁드립니다. 대단히 감사드립니다. – Kirill