javascript - jQueryツールチップ画像のロールオーバー表示 拡大画像

Question

サムネイル画像のリストを表示する画像ギャラリーがあります。jQuery Tooltip プラグインを使用して、ロールオーバー時にツールチップに画像を表示しています。

ただし、サムネイル画像よりも大きな画像を表示したいです。

$(document).ready(function(){
    $('.imageGalleryAlbum li a img').tooltip({ 
        delay: 0, 
        showURL: false, 
        bodyHandler: function() { 
            return $("<img/>").attr("src", this.src); 
        } 
    });
});

私のギャラリーにリストされているサムネイル画像は、次の「_thumb_150.jpg」で終わります

同じディレクトリ/フォルダから「_thumb_630.jpg」を表示したい。

これどうやってするの？

Answer 1

_150 を現在の画像ソースの 630 に置き換えてみてください。

src.replace('150', '630')

bodyHandler: function() { 
    var new_source = this.src.replace('150', '630');

    return $("<img/>").attr("src", new_source); 
}