I am trying to solve the problem of using Javascript to determine the width of my browser's "window". I'm aware different people can mean different things in this context so to be specific I mean the area in green as in this post.
I've read the first two replies to that post and a number of other stackoverflow solutions to this problem, none of which I could get to work: I am using Firefox 27.0.1 with the window maximised on a monitor that is 1920 pixels wide. The scripts says my viewport is 1536 pixels wide. I expected 1920 (or something close).
Based on what I have seen, it seemed to me the simplest solution in my case was this code:
<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>
At the time of writing this code is here. This also says my viewport is 1536 pixels wide when I think it should be 1920.
Where am I going wrong please?
For me this problem is a result of browser zooming. Try control+scroll wheel to see if this changes the results your are getting. If so see How to detect page zoom level in all modern browsers?
Check your viewport meta tag. It should be:
<meta name="viewport" content="width=device-width,initial-scale=1" />
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With