window.open() on a multi-monitor/dual-monitor system - where does window pop up?
Result of "window.open dual-screen" search revealed this fancy nugget: Dual Monitors and Window.open
"When the user clicks on a link that opens a new window using window.open. Make the window appear on the same monitor as its' parent."
// Find Left Boundry of the Screen/Monitorfunction FindLeftScreenBoundry(){ // Check if the window is off the primary monitor in a positive axis // X,Y X,Y S = Screen, W = Window // 0,0 ---------- 1280,0 ---------- // | | | --- | // | | | | W | | // | S | | --- S | // ---------- ---------- if (window.leftWindowBoundry() > window.screen.width) { return window.leftWindowBoundry() - (window.leftWindowBoundry() - window.screen.width); } // Check if the window is off the primary monitor in a negative axis // X,Y X,Y S = Screen, W = Window // 0,0 ---------- -1280,0 ---------- // | | | --- | // | | | | W | | // | S | | --- S | // ---------- ---------- // This only works in Firefox at the moment due to a bug in Internet Explorer opening new windows into a negative axis // However, you can move opened windows into a negative axis as a workaround if (window.leftWindowBoundry() < 0 && window.leftWindowBoundry() > (window.screen.width * -1)) { return (window.screen.width * -1); } // If neither of the above, the monitor is on the primary monitor whose's screen X should be 0 return 0;}window.leftScreenBoundry = FindLeftScreenBoundry;
Now that the code is written, you can now use window.open to open a window on the monitor the parent window is on.
window.open(thePage, 'windowName', 'resizable=1, scrollbars=1, fullscreen=0, height=200, width=650, screenX=' + window.leftScreenBoundry() + ' , left=' + window.leftScreenBoundry() + ', toolbar=0, menubar=0, status=1');
If it successfully allows you to open a popup on the same screen as the document launching it, then with similar effort one should be able to modify it to behave differently.
Note that, as the length of code implies, there is no built-in function for understanding multiple monitors in jquery/javascript/browsers, only that the dual-screen desktop is simply an enlarged single cartesian plane instead of two discrete planes.
Update
The link is dead. Use this waybackmachine link
window.screenX
will give the position of the current monitor screen.
suppose monitor width is 1360
for monitor 1 window.screenX = 0;
for monitor 2 window.screenX = 1360;
so by adding left position with window.screenX
, popup open in expected position.
function openWindow() { var width = 650; var left = 200; left += window.screenX; window.open(thePage,'windowName','resizable=1,scrollbars=1,fullscreen=0,height=200,width=' + width + ' , left=' + left + ', toolbar=0, menubar=0,status=1'); return 0;}
FUNCTION:
function PopupCenter(url, title, w, h, opts) { var _innerOpts = ''; if(opts !== null && typeof opts === 'object' ){ for (var p in opts ) { if (opts.hasOwnProperty(p)) { _innerOpts += p + '=' + opts[p] + ','; } } } // Fixes dual-screen position, Most browsers, Firefox var dualScreenLeft = window.screenLeft != undefined ? window.screenLeft : screen.left; var dualScreenTop = window.screenTop != undefined ? window.screenTop : screen.top; var width = window.innerWidth ? window.innerWidth : document.documentElement.clientWidth ? document.documentElement.clientWidth : screen.width; var height = window.innerHeight ? window.innerHeight : document.documentElement.clientHeight ? document.documentElement.clientHeight : screen.height; var left = ((width / 2) - (w / 2)) + dualScreenLeft; var top = ((height / 2) - (h / 2)) + dualScreenTop; var newWindow = window.open(url, title, _innerOpts + ' width=' + w + ', height=' + h + ', top=' + top + ', left=' + left);// Puts focus on the newWindow if (window.focus) { newWindow.focus(); }}
USAGE:
PopupCenter('http://www.google.com','google.com','900','500', {toolbar:1, resizable:1, location:1, menubar:1, status:1});
It will also work on minimized windows