jQuery Cycle pager附加較小的圖像大小

使用下面的代碼，我將圖像加載到Wordpress上的jQuery滑塊的縮略圖頁面。這工作正常，但問題是，它使用巨大的圖像和調整到小尺寸。這使我的網頁加載速度變慢。所以我在函數中創建了一個自定義圖像大小。這會創建一個名爲slide-181x86.jpg的新小圖像。我的問題是，如何修改最後一行jquery，在url結尾處添加-181x86而不是在jpg結尾處？我一直在收到slide.jpg-181x86，這顯然不對。jQuery Cycle pager附加較小的圖像大小

我一直在對此自殺，任何幫助將不勝感激。

<script type="text/javascript"> 
jQuery(function() { 
jQuery('.homeslider').cycle({ 
    speed: 'fast', 
    timeout: 7000, 
    fx: 'fade', 
    slideResize: false, 
containerResize: false, 
fit:1, 
    pager: '#slitemshome', 
    pagerAnchorBuilder: function(idx, slide) { 
return '<li><a href="#"><img src="' 
    + jQuery(slide).find('img').attr('src') 
    + '" width="181" height="86" /></a></li>'; 
} 
}); 
}); 
</script>

編輯：

我只是試圖功能

jQuery('#slitemshome img').attr('src', function(){this.src.replace('.jpg', '-181x86.jpg')})

後做這做那不顯得無所不用其極的URL。唉

來源

2012-08-30 brianr1

更新到原始帖子 – brianr1

這應該工作：

$('img').each(function() { 
    $(this).attr('src', $(this).attr('src').replace(/\.jpg/, '-181x86.jpg')); 
});

http://jsfiddle.net/charlescarver/3hLH4/

本來我是要找到所有img變量，脫光.jpg結束，然後追加-181x86.jpg到它的結束，但後來我想，爲什麼不把.jpg換成-181x86.jpg呢？

_{附：由於沒有佔位符圖像，末尾附有-181x86.jpg，因此JSFiddle圖像不起作用。}

來源

2012-08-31 00:45:01 Charlie

Yessss !!!這工作完美。萬分感謝！ – brianr1

我現在有一個問題，現在我正在看它。如果我在您的示例中使用img選擇器，它會很好，除了它會更改頁面上所有圖像的URL。我只是試圖定位尋呼機縮略圖。當我將img選擇器更改爲像'.navthumb img'這樣的不起作用的東西時。有什麼建議麼？？ – brianr1

我加了上面的評論，希望你能幫到。謝謝 – brianr1

jQuery Cycle pager附加較小的圖像大小

回答

相關問題