jQuery : 여러 순환 슬라이드 쇼 (내비게이션 포함)

Question

슬라이드 쇼가 클라이언트에 의해 동적으로 추가되어 여러 개의 jQuery 슬라이드 쇼 (다음 및 이전 nav에서)를 구현하는 방법을 알아 내려고 노력하고 있습니다. 그것은 탐색의 다음 인스턴스를 찾아주기 슬라이드 쇼를 이용합니다 이에 뭔가 : 여기

$('.text-page-slideshow').each(function(){ 
var $this = $(this); 
    $this.cycle({ 
     fx: 'fade', 
     speed: 400,  
     timeout: 0, 
     next: $this.next('.nav-next'), 
     prev: $this.next('.nav-prev') 
    });  
}); 

너무 jsfiddle 데모입니다 : http://jsfiddle.net/ncknm/2/
그냥 내가 부족 일 수도 있지만 예를 들어 내가 ' m : .nav-next의 다음 인스턴스를 찾으려고 할 때 해당 슬라이드 쇼의 탐색으로 사용할 수 있지만 작동하지 않는 것 같습니다. 어떤 제안이라도 대단히 감사하겠습니다.

Answer 1

이 페이지가 서버 측 스크립트에 의해 생성되기 때문에이

http://jsfiddle.net/ncknm/3/

(한 VAR를 증가), 그러나, 그것은 문제가되지 않습니다, 각 슬라이드 쇼 컨테이너에 대한 고유 식별자를 제공 할 것으로 보인다

JQuery :

$(document).ready(function() { 



for(i=1;i<3;i++) { //you can easily get number from database, i hope 

$('#slider'+i).cycle({ 
     fx: 'fade', 
     speed: 400,  
     timeout: 0, 
     next: $('#slider'+i).next().children('.nav-next'), 
     prev: $('#slider'+i).next().children('.nav-prev') 
    }); 


} 



}); 

PS 사이클 기능 안의 $ (this)는 원하는 div를 참조하지 않습니다 ... 그게 문제였습니다.

당신은 WP 템플릿 파일에 파고하지 않으려면,이에 시도하십시오 : 그-훌륭한 솔루션에 대한

jQuery.each($(".text-page-slideshow"), function(i) { 

$(this).attr('id',"slider"+i); 
$('#slider'+i).cycle({ 
     fx: 'fade', 
     speed: 400,  
     timeout: 0, 
     next: $('#slider'+i).next().children('.nav-next'), 
     prev: $('#slider'+i).next().children('.nav-prev') 
    }); 

}); 


});