2012-11-12 2 views
0

저는 작업중인 프로젝트의 DIV에서 100 % [창] 높이를 얻으려고했습니다. 그것은 바탕 화면에서 잘 작동하지만, iPhone 4 또는 Android 폰을 사용하여로드하려고하면 첫 번째 div는 100 %로 표시됩니다. 그러나 각각의 후속 DIV는 약 50 픽셀 (추정치)에 불과합니다.iPhone에서 DIV를 100 % [window] 높이로 높이려면 어떻게해야합니까?

나는 수행하여 CSS를 통해 설정을 시도 다음

<!DOCTYPE html> 
<head> 
<style type="text/css"> 
    html, body { 
     margin: 0; 
     padding: 0; 
     width: 100%; 
     height: 100%; 

    div#container { 
     width: 100%; 
     height: 100%; 
    } 

    div#section1 { 
     width: 100%; 
     height: 100%; 
     background-color: blue; 
    } 

    div#section2 { 
     width: 100%; 
     height: 100%; 
     background-color: red; 
    } 
</style> 
</head> 
<body> 
    <div id="container> 
     <div id="section1"> 
      . . . 
     </div> 
     <div id="section2"> 
      . . . 
     </div> 
    </div> 
</body> 
</html> 

나는 또한 비슷한 사용하여 jQuery를 함께 자바 스크립트를 통해 설정을 시도 :

var browser_width = $(window).width(); 
var browser_height = $(window).height(); 

$(document).ready(function(){ 
    $("#section1, #section2").css("width", browser_width, "height", browser_height); 
}); 

을하지만 같은 방법으로 동작합니다 CSS. 누구든지 올바른 방향으로 나를 가리킬 수 있습니까?

답변

0

당신은 스크립트

$(document).ready(function(){ 
    $("#section1, #section2").css({ 
    "width" : browser_width, 
    "height" : browser_height 
    }); //css 
}); 

UPDATE.css() 방법에 대한 권리 형식을 설정해야합니다 : 또한 내가 첫 번째 CSS를 선언

html, body { 
     margin: 0; 
     padding: 0; 
     width: 100%; 
     height: 100%; 

닫습니다 잊었 발견 ... 닫는 대괄호 }이 없습니다.

사이드 노트 다음 html 및/또는 body 태그 내가 설정하지 않을 치수 특성은 예기치 않은 결과를 피하기 위해 ... 당신이

+0

을 무엇을하는지 아는하지 않는 jQuery를 구문이 올바른지. 쉼표를 사용해야합니다. 세미콜론이 아닙니다. 나는 당신의 제안을 시도하고 그것은 스크립트를 부러 뜨 렸습니다. –

+0

@ChrisAmini 옙 내 친구지만, 괄호'.css ({ "": "}})를 추가하지 않았다. 쉼표를 사용하는 구문은 여러 속성이 아닌 단일 속성을 설정할 때 유효합니다. [예 : 모든 단락의 색상을 빨간색으로, 배경을 파란색으로 설정하려면 :] (http://api.jquery.com/css/) – JFK

+0

맞습니다. 나는 당신의 코멘트를 보지 못했습니다. 나는 이것을 시도해 보았고 그 높이는 변수들로 전혀 작용하지 않는 것 같다. 또한 백분율을 허용하지 않습니다. 그것은 정적 정수와 잘 작동합니다. https://gist.github.com/4062203 –

관련 문제