獲得高度和圖像改變源屬性的寬度，jQuery的

Question

我具有其中一個大的圖像被一次顯示一個非常簡單的圖像畫廊。我在主圖像右側有一個大標題，我試圖將它放在靠近圖像本身的位置。當主圖像是水平的時候，標題在最右邊。當主圖像是垂直的時候，標題從其DIV右邊大約30px。

當點擊縮略圖，一個新的圖像被創建並加載。我試圖然後改變主圖像的源屬性，得到其外形尺寸，和字幕相應的位置。但是當我點擊另一個尺寸的圖片時，它似乎只顯示了之前圖片的尺寸。如果我再次點擊相同的圖像，它就會起作用。

這裏是jQuery-

$("#apparatus_thumbs a").click(function() { 
      var src = $(this).attr("href"); 
      var caption = $(this).attr("title"); 
      var wrap = $("#apparatusPhoto").fadeTo("medium", 0.5); 
      var img = new Image(); 
      $(img).load(function() { 
       wrap.fadeTo('fast', 1); 
       $("#apparatusPhoto").attr('src', src); 
       var height = $("#apparatusPhoto").height(); 
       var width = $("#apparatusPhoto").width(); 
       if (height > width) { 
        $("#apparatusPhotoCaption").css('right', '150px'); 
       } else { 
        $("#apparatusPhotoCaption").css('right', '0px'); 
       } 
       if (caption != '') { 
       $("#apparatusPhotoCaption").html(caption); 
       $("#apparatusPhotoCaption").fadeIn('slow'); 
       } else { 
        $("#apparatusPhotoCaption").fadeOut('slow'); 
       } 
       console.log('image loaded'); 
      }).attr('src', src); 
      return false; 
     }); 

任何想法？

更新 這似乎是工作。刪除圖像，然後附加新的，似乎是給出了預期的結果。

$("#apparatus_thumbs a").click(function() { 
      var src = $(this).attr("href"); 
      var caption = $(this).attr("title"); 
      var wrap = $("#apparatusPhoto").fadeTo("medium", 0.5); 
      var img = new Image(); 
      $(img).load(function() { 
       wrap.fadeTo('fast', 1); 
       $("#apparatusPhoto").find('img').remove(); 
       $("#apparatusPhoto").append(img); 
       var height = $("#apparatusPhoto img").height(); 
       var width = $("#apparatusPhoto img").width(); 
       if (height > width) { 
        $("#apparatusPhotoCaption").css('right', '150px'); 
       } else { 
        $("#apparatusPhotoCaption").css('right', '0px'); 
       } 
       if (caption != '') { 
       $("#apparatusPhotoCaption").html(caption); 
       $("#apparatusPhotoCaption").fadeIn('slow'); 
       } else { 
        $("#apparatusPhotoCaption").fadeOut('slow'); 
       } 
       console.log('image loaded'); 
      }).attr('src', src); 
      return false; 
     }); 

Answer 1

我不知道，如果​​當您從已加載的值更改圖像.src別的東西會火可靠在所有瀏覽器。

之前，不得不創建一個新的圖像對象，新的URL加載到該對象，新對象使用load事件，然後用新的替換舊的圖像對象我已經受夠了的問題。