2011-01-07 2 views
0

큰 슬라이더 이미지와 더 작은 "축소판 이미지"가 있습니다. 지금까지이 코드가 있습니다Jquery는 하나의 소스 이미지를 다른 이미지에 적용합니다.

$j(".slider-img").each(function(){ 
    var slideSource = $j(this).attr("src"); 
    $j(".slider-thumb").each(function() { 
    $j(this).attr("src", slideSource); 
    }); 
}); 

을하지만 그 축소판 모두를위한 첫 번째 슬라이드에서 나에게 이미지를 제공합니다. 그래서 각 .slider-img에서 소스를 가져 와서 각 .slider-thumb에 적용하고 싶습니다. 아이디어?

+0

이것은 의미가 없습니다. 두 사람이 어떤 식 으로든 연관되어 있습니까? 마지막 .slider-img만이이 코드 설정에서 영향을 미칩니다. –

답변

1

클래스와 다른 문서에서 같은 위치에, 친척 .slider-thumb에 해당하는 .slider-img를 가정하면, 당신은이를 사용할 수 있습니다

var thumbs = $j('.slider-thumb'); 
$j('.slider-img').each(function(i) { // i is the position in the set 
    thumbs.eq(i).attr('src', this.src); // set the src attribute of the element with position i in the thumbs set to the src of this element 
}); 
+0

이 방법이 효과적이지만 슬라이드 1에는 썸네일 5, 슬라이드 2에는 썸네일 1이 있습니다. 웬일인지 썸네일은 그들의 슬라이드보다 앞서 뛰고있다! 매우 이상하지만, 시작, 감사합니다! 그 일을하는 이유에 대한 아이디어가 있습니까? – Tom

+0

@Tom 아마 이미지가 소스 코드에서 같은 순서로 있지 않습니다. HTML을 보여줄 수 있다면 도움이 될 것입니다. – lonesomeday

+0

지연되어 죄송합니다. 작동하도록하십시오. 감사! – Tom

0

을 당신은 해당 엄지 손가락을 찾을 수있는 방법이 필요 당신이 당신의 이미지에있을 때. 부모 이미지 (또는 엄지 손가락)의 "rel"속성 일 수 있습니다. 공식적인 것은 아니지만 w3c는 깨끗하지만 사용 된 :-)

"걷기"로 엄지 찾기를 시도 할 수 있습니다. .

여기
$j(".slider-img").each(function(){ 
    var slideSource = $j(this).attr("src"); 
    var thethumb = $j(".slider-thumb", 
    $j(this).parent('div') 
    .next() 
    .child('table:first') 
    .next() 
    ); 
    thethumb.attr("src", slideSource); 
}); 

내가 $ j를 (". 슬라이더 - 엄지 손가락", 컨텍스트) 셀렉터에 컨텍스트를 사용 컨텍스트가의 일부입니다 다음 travsering 기능 http://api.jquery.com/category/traversing/와 DOM에 그런 뭔가를 만들 수 DOM "slider-thumb"클래스가있는 유일한 이미지가 타겟인지 확실합니다.

+0

각 게시물에 간단한 번호를 부여 할 수 있습니까? 그래서 게시물은 rel = 1 일 것입니다. 어떻게 구현할 수 있을까요? – Tom

+0

collest는 각 게시물에 고유 한 "id"id를 추가하고 슬라이더 이미지에 '-slider'를 사용하여 동일한 ID와 동일한 ID를 추가 한 다음 슬라이더 이미지에서 ID를 추출하고 '-slider'를 제거한 다음 id $ ("#"+ myid)로 엄지를 선택할 수 있습니다. 이드와 함께 플레이 할 수 없다면 목표는 슬라이드 이미지에 rel = "the-corresponding-thumb-id"속성을 추가하는 것입니다. 그런 다음 $ (this) .attr (rel)을 사용하여 추출합니다. 그러나 나는 당신의 필요를 completly 이해한다 :-) – regilero

관련 문제