サイズを変更して計算した高さ - バグ

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Untitled Document</title> 
<style type="text/css"> 

body { 
    text-align: center; 
} 

#prob { 
    background-color: #F00; 
    width: 300px; 
    text-align: center; 
    line-height: 200px; 
    display: inline-block; 
    vertical-align: middle; 
} 

#prob img { 
    width: 200px; 
    height: 150px; 
    display: inline; 
    vertical-align: middle; 
} 


</style> 
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.2.js"></script> 
<script type="text/javascript"> 

$(document).ready(function(){ 

    var img = new Image(); 
    img.src = 'http://galerijauspomena.net76.net/images/10042011744.jpg'; 

    var div = $("#prob").get()[0]; 
    alert($(window).height()); // First showing good height, but few px larger than a page 
    document.getElementById("cont").style.lineHeight = $(document).height() + 'px'; 

    $(window).resize(
     function(){ 
      alert($(document).height()); // On resize down or up, its showing always bigger px, even on Firefox freeze browser! 
      document.getElementById("cont").style.lineHeight = $(document).height() + 'px'; 
     } 
    ); 
    div.appendChild(img); 

}); 
</script> 
</head> 
<body> 
<div id="cont">&nbsp; <!-- nbsp in order to line-height to work. Is it any way without it? --> 
<div id="prob">&nbsp;</div> 
</div> 
</body> 
</html>

サイズを変更した後、サイズを変更した後、計算された高さが常に大きくなることがわかりました。私はいくつかの間違いをしていますか？サイズを変更して計算した高さ - バグ

また、リサイズに、Firefoxは自己それを凍結...

出典

2011-07-29 Dexy_Wolf

私はあなたが何をしようとして理解していた場合、あなたは$(window).height()ないdocumentを使用します。問題は、行の高さを増やすと、ドキュメントのサイズが大きくなり、行の高さが増し、ドキュメントのサイズが増えるなどです。したがって、サイズが大きくなっていくだけです。

出典

2011-07-29 14:10:44

それは私の問題を解決しました。縦列を整えるためには、これらのnbspのない方法はありますか？ –

サイズを変更して計算した高さ - バグ

答えて

関連する問題