jquery將一個源圖像應用到另一個

我有一個較大的滑塊圖像和一個較小的「縮略圖」圖像。我到目前爲止這樣的代碼：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。想法？

來源

2011-01-07 Tom

這沒有任何意義。兩者以任何方式相關？只有最後一個.slider-img會在這個代碼設置中產生任何效果。 – 2011-01-07 21:45:36

。假定對應於.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 
});

來源

2011-01-07 21:44:51 lonesomeday

這有效，但由於某種原因，幻燈片1有縮略圖5，幻燈片2有縮略圖1，依此類推。出於某種原因，縮略圖在幻燈片前跳躍！很奇怪，但它是一個開始，謝謝！關於爲什麼要這樣做的任何想法？ – Tom 2011-01-08 16:24:46

@Tom可能圖像在源代碼中的順序不同。如果你能顯示你的HTML，這將有所幫助。 – lonesomeday 2011-01-09 08:38:50

您需要一種方法來找到相應的拇指當你在你的形象。它可以是你的父母圖像（或拇指）上的「rel」屬性，它不是非常官方的-w3c-clean，但它被用於:-)

你也可以嘗試通過「步行與travsering功能http://api.jquery.com/category/traversing/的DOM它可以使類似的東西：

$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（「滑塊拇指」，上下文）選擇的背景是的一部分DOM你肯定唯一的圖像與類「滑塊拇指」是你的目標。

來源

2011-01-07 22:23:48 regilero

jquery將一個源圖像應用到另一個

回答

相關問題