Javascript on Multiple Monitor Systems

I have a preference to keep my browser windows a certain width (1024 pixels for various reasons), flush against the right side of my monitor display, and taking the full height of the screen.  To do this, I have the following javascript on my start page:

resizeTo( 1024, screen.availHeight );
moveTo( (screen.availWidth - 1024), 0 );

For some reason though, Firefox has always had some strange behavior when running this script on my systems with multiple monitors.

When on the second display, the window will resize itself properly, but will not position itself according to the math above.  Even inspecting the availWidth field turns out what I’d expect…

I finally figured out why. The moveTo method doesn’t work on the same origin point as the availWidth fields. The important javascript properties that I need to know about are the screen.availLeft and screen.availTop.

In Firefox…  When multiple monitors are positioned side-by-side, availLeft on the left monitor will be zero, and on the right monitor it will be 1024 (or whatever the width resolution is on monitor on the left).  When there is only one screen, availLeft will be zero.

When multiple monitors are stacked vertically, availLeft will be zero on both monitors, and availTop will be zero on your main monitor (the one with the windows task bar) and will be -768 on the other monitor.  This is inconsistent with the availLeft behavior, but once we know about it, it is easy to work around.

So now, my start page script has the following code:

resizeTo( 1024, screen.availHeight );
moveTo( screen.availLeft + (screen.availWidth - 1024), 0 );

When on a single screen, availLeft is zero, and doesn’t affect the calculation.  When on a multi-screen display, it will position the browser as I desire, regardless of which screen the browser is on.

Updated April 08: Also see my follow-up post on OSX + Javascript + Multiple Monitors.

2 thoughts on “Javascript on Multiple Monitor Systems”

  1. as this is the top google result for multiple monitor moveTo, i’ll add a warning flag as i look for more help with centering a window. everything described above is correct, with the exception that there seem to be differences in how moveTo works between browsers. i can’t test ie right now, but firefox moveTo works relative top/left-most monitor origin, while in safari each display has its own origin for moveTo. hope this helps.
    (btw,very clever to use start page/bookmarklets to position browser windows, i’ll have to try it!)

Comments are closed.