Monday, December 29, 2008

Window And Element Viewport Size (Width and Height) With Java-script

<script type="text/javascript">
 var viewportwidth;
 var viewportheight;

/*the more standards compliant browsers (mozilla/netscape/opera/IE7)
use window.innerWidth and window.innerHeight*/
 if (typeof window.innerWidth != 'undefined')
 {
 viewportwidth = window.innerWidth,
 viewportheight = window.innerHeight
 }
/*IE6 in standards compliant mode
(i.e. with a valid doctype as the first line in the document)*/
 else if (typeof document.documentElement != 'undefined'
 && typeof document.documentElement.clientWidth !=
 'undefined' && document.documentElement.clientWidth != 0)
 {
 viewportwidth = document.documentElement.clientWidth,
 viewportheight = document.documentElement.clientHeight
 }
// older versions of IE
 else
 {
 viewportwidth = document.getElementsByTagName('body')[0].clientWidth,
 viewportheight = document.getElementsByTagName('body')[0].clientHeight
 }

function getElementWith(el)
{
 if (el){
/*the more standards compliant browsers (mozilla/netscape/opera/IE7)
use window.innerWidth and window.innerHeight*/
  if (typeof el.innerWidth != 'undefined')
  {
  return el.innerWidth
  }
/*IE6 in standards compliant mode
(i.e. with a valid doctype as the first line in the document)*/
  else if (typeof el != 'undefined'
  && typeof el.clientWidth !=
  'undefined' && el.clientWidth != 0)
  {
  return el.clientWidth
  }
// older versions of IE
  else
  {
  return el.clientWidth
  }
 }
}
</script>

No comments:

Post a Comment