jQuery的實際圖像diamension

我有一個1024×768圖像jQuery的實際圖像diamension

<span class="frame"> 
<img alt="Image" title="Image" src="hD41120CA-7164-11DF-A79E-F4CE462E9D80_Green_Sea_Turtle.jpg"> 
</span>

和下面CSS設置圖像寬度

.frame img{ 
    width:425px; 
}

而jQuery代碼

$('.uploaded_image img').attr("width");

返回425

我如何檢索實際JavaScipt中的圖像寬度1024？

來源

2010-06-06 Mithun Sreedharan

http://stackoverflow.com/questions/318630/get-real-image-width-and-height-with-javascript-in-safari-chrome – Adam 2010-06-06 18:25:18

我不確定，但我認爲所有尺寸相關的功能（如.width()）將返回實際寬度，而不是圖像的實際寬度。

你可以做什麼，是在JavaScript中添加一個新的圖像，源設置爲您的原始圖像的來源，並從中獲得寬度。

一個未經考驗的例子：

tmp_image = new Image(); 
tmp_image.src = $('.uploaded_image img').attr("src"); 
image_width = tmp_image.width;

來源

2010-06-06 18:33:52 jeroen

絕對太棒了！ – 2010-06-06 19:13:29

你必須知道，圖像的寬度不提供給瀏覽器的JavaScript核心，直到圖像完全加載。我建議在圖像對象的onload事件中獲取該圖像的寬度。

另一個問題是，你得到你的arent通過節點的屬性寬度...

要設置圖像的onload事件將是這樣的：

$('#imageid').load(function() { 
     $(this).css({ width: "", height: "" }).removeAttr("height").removeAttr("width"); 
     var REAL_WIDTH = this.width; 
})

圖像的代碼：

<span class="frame"> 
<img alt="Image" id="imageid" title="Image" src="http://localhost/zapav/site/assets/questions/D41120CA-7164-11DF-A79E-F4CE462E9D80_Green_Sea_Turtle.jpg"> 
</span>

而且，我必須說，加載事件不會在緩存圖片觸發...

來源

2010-06-06 18:50:13

也許這樣的東西將是有用的

對於你不想改變原來的位置或圖像的功能。

$(this).clone().removeAttr("width").attr("width"); 
$(this).clone().removeAttr("height").attr("height);

來源

2010-06-09 15:19:45 holms

jQuery的實際圖像diamension

回答

相關問題