圖像的尺寸與加載時和加載後不同

我有一個加載大量相當大的圖像（大約200個100Kb圖像[大約600 x 400像素]）的頁面。圖像的尺寸與加載時和加載後不同

我想要做的是操縱照片，如果它是在肖像，而不是風景。

我遇到的問題是，當我使用JavaScript來抓取肖像照片的屬性時，它的加載，高度明顯低於它應該是，並且寬度比它應該更大。具體而言，75 x 100圖像被認爲是100 x 16.因此，當該功能貫穿此圖像時，圖像被認爲是風景，而不是人像，並跳過。

我很難識別問題，因爲該屬性在加載完成後顯示爲75 x 100像素的圖像。

有沒有辦法解決這個問題？或在所有圖像加載後運行該功能？

來源

2010-09-26 j Ko

在頁面元素加載完成後運行javascript總是一個好主意。我通常這樣做jQuery的，就像這樣：

$(function(){ 
    //code to run after load goes here 
});

否則，您可以嘗試修改body標籤，並給它一個onload屬性，如：

<body onload="myFunction();" >

來源

2010-09-26 05:06:07

運行它加載後的功能，你會做這樣的：

使用DOM專門

var newImg = document.createElement('img'); 
newImg.src = "theImage.png"; 
newImg.alt = "Always specify an alternate text for accessibility, even if left blank"; 
newImg.onload = function() { 
    //Image manipulation 
}; 
galleryNode.appendChild(newImg); //Replace galleryNode with the parent element of your image.

使用的innerHTML

galleryNode.innerHTML += "<img src='theImage.png' alt='' id='newImage1'/>"; 
var newImg = document.getElementById('newImage1'); 
newImg.onload = function() { 
    //Image manipulation 
};

使用jQuery

$('.gallery img').live('load',function() { 
    //Image manipulation 
});

來源

2010-09-26 05:08:08

圖像的尺寸與加載時和加載後不同

回答

相關問題