이미지 높이가 항상 0으로 반환되었습니다.

나는 this을 따라 가려고 했으므로 이미지에 색조를 적용하는 방법에 대한 답을했지만, 할 때 $("#myselector").height();은 0으로 반환됩니다. 내가 잘못 했나요? Heres는 내 코드 :이미지 높이가 항상 0으로 반환되었습니다.

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <title>Test</title> 
    <link rel="stylesheet" href="style.css"> 
    <!--[if IE]> 
     <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> 
    <![endif]--> 
</head> 
<script src="http://codeorigin.jquery.com/jquery-1.10.2.min.js"></script> 

<script> 
$(document).ready(function() { 
    overlay = $("#overlay"); 
img = $("#myimg"); 
overlay.width($("#myimg").width()); 
alert($("#myimg").height()); 
overlay.height("100"); 
overlay.css("top", img.offset().top + "px"); 
overlay.css("left", img.offset().left + "px"); 

}); 


</script> 

<body id="home"> 

<div id="overlay" class="overlay"></div> 
<img id="myimg" src="building.png" /> 

</body> 
</html>

출처

2013-08-12 TMB87

소스에서 그는 overlay.height (img.css ("height"))를 사용합니다. –

이미지 사용 'load 이벤트 :

$(document).ready(function() { 
    overlay = $("#overlay"); 
    img = $("#myimg"); 
    img.load(function(){ 
    overlay.width($("#myimg").width()); 
    alert($("#myimg").height()); 
    overlay.height("100"); 
    overlay.css("top", img.offset().top + "px"); 
    overlay.css("left", img.offset().left + "px"); 
    }); 
});

출처

2013-08-12 12:15:49 Cherniv

당신은 아름다운 사람입니다. 감사! – TMB87

@TomBeech 당신을 환영합니다, 다행히 도왔습니다! – Cherniv

내 추측 이미지가 아직로드되지 않는 것입니다.

스크립트 실행시 onready입니다. onload으로 변경하면 더 나은 결과를 얻을 수 있습니다.

변경

$(document).ready(function() {

$(window).load(function() {

더에 : window.onload vs $(document).ready()

출처

2013-08-12 12:16:05 Halcyon

바꾸기 :

$(document).ready(function() {

에 :

$(window).load(function() {

출처

2013-08-12 12:16:58

이와 같은 대답은 변화가 가져 오는 효과를 설명하는 것이 중요합니다. 이 경우'$ (window) .load'가'$ (document) .ready'보다 우월하다고 생각하는 이유는 무엇입니까? –

이미지 높이가 항상 0으로 반환되었습니다.

답변

관련 문제