2014-03-01 4 views
2

자바 스크립트를 사용하여 브라우저의 "창"너비를 결정하는 문제를 해결하려고합니다. 나는 다른 사람들이이 맥락에서 다른 것을 의미 할 수 있다는 것을 알고 있습니다. 구체적으로 말하자면, 녹색으로 표시된 부분은 this입니다.왜 window.innerWidth가 올바른 값을 반환하지 않습니까?

나는 그 게시물과이 문제에 대한 다른 많은 stackoverflow 솔루션에 대한 첫 번째 두 가지 대답을 읽었으며 어느 것도 작동하지는 못했다. 나는 모니터에서 최대화 된 창과 함께 Firefox 27.0.1을 사용하고있다. 너비는 1920 픽셀입니다. 스크립트에 의하면 내 뷰포트의 너비는 1536 픽셀입니다. 나는 1920 년 (또는 가까운 무언가)을 기대했다. 이 코드를 작성하는 것은 here입니다 당시

<html> 
<head> 
<script type="text/javascript"> 
function onAfterLoad() { 
    document.write('<p>Your viewport width is '+window.innerWidth+'</p>'); 
} 
</script> 
</head> 
<body onload="onAfterLoad();"> 
</body> 
</html> 

: 내가 본 것을 바탕으로

는, 내 경우에는 간단한 해결책이 코드를했다 나에게 보였다. 또한 내 뷰포트의 너비가 1536 픽셀이고 너비가 1920이어야한다고 말합니다.

어디에서 잘못하고 있습니까?

답변

3

나는 당신이 jQuery Dimension Functions.으로 시도하고 자바 스크립트 기능을 다루어야한다고 생각한다.

대부분의 기초가

$(window).width()

입니다

$(window).height()가 (브라우저의 높이를 얻을)이 도움이

희망 (브라우저의 폭을 얻을 수 있습니다).

+0

이 작업을 수행하는 방법을 모르겠다. 내 명백한 추측 http://www.kilgore.org.uk/surfing/fixed5.html 내게 빈 페이지를 제공합니다. – user1476044

0

첫째 :
당신이 있습니까 확인 뷰포트 폭의? 브라우저 창 너비 또는 전체 화면 너비를 가져 오시겠습니까? 자바 스크립트에서 불가능한 전체 화면의 너비를 원한다면. 둘째
:
브라우저 윈도우의 폭을 얻기 위해이 시도 :

function GetWidth() 
{ 
var width = document.body.clientWidth; 
document.write('<p>Your viewport width is '+width+'</p>') 
} 
+0

제안 해 주셔서 감사합니다.하지만 아무런 차이가없는 것으로 보입니다. http://www.kilgore.org.uk/surfing/fixed4.html을 참조하십시오. – user1476044

+0

질문에 답글을 달아 추가하는 것을 잊어 버렸습니다. 그렇습니다. 브라우저 창 너비. – user1476044

+0

@ user1476044 얼마 전 'innerWidth'에는 브라우저 간 문제가있었습니다. 그러나 내가 위에서 말했듯이 ** TRY **. 그리고 그 사이트에서 일했습니다! 그들은'document.body.clientWidth'를 사용합니다. –

-1

당신의 코드가 나를 위해 잘 작동합니다. 그것은 1600 (나는 1600 x 900 스크린을 가졌다)을 말한다. 코드를 호출 할 때 브라우저가 최대화되어 있습니까? 해상도가 1536 x 무언가이며 화면이 늘어 났을 수 있습니까? 나는 당신의 스크린 설정에서 그것을 조사 할 것이다. Chrome과 Devtools를 연 다음 브라우저의 크기를 조정하는 방법도 있습니다. 브라우저 창 크기가 표시됩니다.

+0

브라우저 창이 최대화되고 화면의 너비가 1920 픽셀입니다. 나는 Chrome/Devtools를 사용해 보았는데, 내 창문은 1740 개의 너비와 8px 테두리로 총 1756 개가 있다고합니다. 아직은 시가가 없지만 더 가깝습니다. – user1476044

0

텍스트가 25 % 더 크게 표시되도록 Microsoft Windows 7을 구성하면 Firefox는 실제 크기의 1/1.25 배가되도록 화면을보고합니다. 어떤 정확히 1536 실제 1920

에 대한 (캔버스 심지어 사각형. 다음 25 % 너무 큰 그려져있다, 미친 사라 졌어요.)되어

0

가 뷰포트 메타 태그를 확인합니다.그것은해야한다 :

<meta name="viewport" content="width=device-width,initial-scale=1" />

2

는 나에게이 문제는 브라우저가 확대의 결과이다. 컨트롤 + 스크롤 휠을 사용해보십시오. 결과가 변경되는지 확인하십시오. 만약 그렇다면 How to detect page zoom level in all modern browsers?

+0

이것도 나를 위해 고정 – rkd

관련 문제