advanced search

We Recommend

Pro JavaScript Techniques Pro JavaScript Techniques
Pro JavaScript Techniques is the ultimate JavaScript book for the modern web developer. It provides everything you need to know about modern JavaScript, and shows what JavaScript can do for your web sites. This book doesn't waste any time looking at things you already know, like basic syntax and structures.

Posted By

gbot on 04/17/08


Tagged

window viewport


Versions (?)


Who likes this?

3 people have marked this snippet as a favorite

gbot
SmpleJohn
ibomb


Get browser viewport width and height

Published in: JavaScript 

Plain TextExpand 
  1. <script type="text/javascript">
  2. <!--
  3.  
  4.  var viewportwidth;
  5.  var viewportheight;
  6.  
  7.  // the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
  8.  
  9.  if (typeof window.innerWidth != 'undefined')
  10.  {
  11.       viewportwidth = window.innerWidth,
  12.       viewportheight = window.innerHeight
  13.  }
  14.  
  15. // IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)
  16.  
  17.  else if (typeof document.documentElement != 'undefined'
  18.      && typeof document.documentElement.clientWidth !=
  19.      'undefined' && document.documentElement.clientWidth != 0)
  20.  {
  21.        viewportwidth = document.documentElement.clientWidth,
  22.        viewportheight = document.documentElement.clientHeight
  23.  }
  24.  
  25.  // older versions of IE
  26.  
  27.  else
  28.  {
  29.        viewportwidth = document.getElementsByTagName('body')[0].clientWidth,
  30.        viewportheight = document.getElementsByTagName('body')[0].clientHeight
  31.  }
  32. document.write('<p>Your viewport width is '+viewportwidth+'x'+viewportheight+'</p>');
  33. //-->
  34. </script>

Report this snippet 

You need to login to post a comment.