Javascript圖像高度和其他計算

我在獲取高度和計算其他計算時遇到了問題。Javascript圖像高度和其他計算

我想要得到的圖像高度已加載之後，所以我把它放在<img></img>功能的onload屬性，這裏是我的代碼

<p class="test1" style="position:absolute;bottom:0px;"> 
    <img src="'+getBaseURL()+'js/check/no-image.png" rel="fullname" 
     onload="verticalCenter()"/> 
</p> 

function verticalCenter(){ 
    var imageHeight = jQuery(".test1 img").height(); //I get a result of 0 
    var total = imageHeight/2 + 80 
}

我已經使用setTimeout的嘗試，但它仍然失敗。我打算做的，是給<p class="test1">的CSS設置成這樣的：

jQuery(".test1").css("bottom","-"+total);

正如我所說的，這是行不通的，因爲我沒有得到在總的結果。

我該如何做到這一點，有沒有辦法解決這個問題，我已經在這個問題上撓頭了。

在此先感謝！

來源

2011-07-27 PinoyStackOverflower

這是在onload事件？好像它試圖在圖片尚未加載時獲得高度。所以而不是嘗試'$（window）.load（function（）{\\ code here}' – Matt

感謝馬特，而不是修改我的答案，我已經刪除了它，你應該回答這個;-) –

Take仔細看看@ Matt的評論如上。 – Sparky

您需要CSS尺寸的單位。

jQuery(".test1").css("bottom","-"+total+"px");

您也應該檢查，以確保total是你期望它是設置它之前的值。

http://jsfiddle.net/jfriend00/yHqr7/

來源

2011-07-27 04:30:57 jfriend00

這可能是更容易設定所有的圖像高度時的形式準備：

$(document).ready(
    $('p.text1 img').each(verticalCenter); 
)

除非你正在使用AJAX來加載圖像;如果是這樣的話，那麼你應該使用實時（）事件：

$('p.text1 img').live(verticalCenter);

然後在你的功能，你可以設置一切：

function verticalCenter(){ 
    $(this).css('bottom',"-" + ($(this).height()/2 + 80) + 'px'); 
}

來源

2011-07-27 04:48:47 rkw

順便說一下，我在這裏犯了一個錯誤，它應該是這樣的： – PinoyStackOverflower

$(window).load(function() { 

    var imageHeight = jQuery(".test1 img").height(); //I get a result of 0 
    var total = imageHeight/2 + 80 

} 


<p class="test1" style="position:absolute;bottom:0px;"> 
    <img src="'+getBaseURL()+'js/check/no-image.png" rel="fullname"/> 
</p>

來源

2011-07-27 05:16:03 Matt

Javascript圖像高度和其他計算

回答

相關問題