Detect screen width for multiple monitors

Question

My website is optimized (with fixed width) for 1024x768 layout. I plan to add vertical banners on either side of the page for people having resolution width 1280 or higher.<

Answer 1

Thanks for your response duskwuff. Helped me compile the below function which solved the problem for me.

function getBrowserWith()
{
    if(($.browser.msie == true && $.browser.version == '9.0') || $.browser.webkit == true || $.browser.mozilla == true)
        return window.innerWidth;
    else if(($.browser.msie == true) && ($.browser.version == '7.0' || $.browser.version == '8.0'))
        return document.documentElement.clientWidth;
    else
        return screen.width;
}

Important notes

1. jQuery 1.4+ is required
2. Note that the above function has been tested only for IE7+, FF7+ & Chrome16+ browsers.

Answer 2

Try looking at window.innerWidth (the width of the web page on screen) instead of window.screen.width.