Recommended:

  • phpclasses.org
  • jsclasses.org
  • jsmag.com
  • siteapps.com
  • View our reviews on Hot Scripts
  • JS Tutorial
  • scripts.com
  • securesignup.com




Recent Comments

Powered by Disqus




Back to articles

Crossbrowser viewport size

This function allows you to get viewport dimensions (width and height). Viewport is an area that is available for webpage, that is screen resolution - toolbars etc.

//get viewport size
var viewport = function(){
    var viewport = new Object();
    viewport.width = 0;
    viewport.height = 0;
    // the more standards compliant browsers (mozilla/netscape/opera/IE7) 
    //use window.innerWidth and window.innerHeight
    if (typeof window.innerWidth != 'undefined')
    {
        viewport.width = window.innerWidth,
        viewport.height = window.innerHeight
    }
    else if (typeof document.documentElement != 'undefined'
    && typeof document.documentElement.clientWidth !=
    'undefined' && document.documentElement.clientWidth != 0)
    {
        viewport.width = document.documentElement.clientWidth,
        viewport.height = document.documentElement.clientHeight
    }
    else
    {
        viewport.width = document.getElementsByTagName('body')[0].clientWidth,
        viewport.height = document.getElementsByTagName('body')[0].clientHeight
    }
    return viewport;
};

var vp = viewport();
alert(vp.width + " x " + vp.height);

And here you can test it:


You may also be interested in:

Powered by BlogAlike.com

blog comments powered by Disqus