webentwicklung-frage-antwort-db.com.de

window.open () auf einem System mit mehreren Monitoren / zwei Monitoren - wo erscheint das Fenster?

Wie steuern Sie bei Verwendung von Javascript window.open () auf einem System mit mehreren Monitoren, welcher Monitor oder wo im Anzeigebereich das Popup geöffnet wird? Es scheint mir unkontrolliert und ansonsten zufällig in seinem Verhalten.

javascriptpopupwindowwindow.openmultiple-monitors
34
Bob Brunius

Das Ergebnis der Suche nach "window.open dual-screen" ergab dieses ausgefallene Nugget: Dual Monitors und Window.open

"Wenn der Benutzer mit window.open auf einen Link klickt, der ein neues Fenster öffnet, wird das Fenster auf demselben Monitor wie das übergeordnete Fenster angezeigt."

// Find Left Boundry of the Screen/Monitor
function 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;

Nachdem der Code geschrieben wurde, können Sie jetzt mit window.open ein Fenster auf dem Monitor öffnen, auf dem sich das übergeordnete Fenster befindet.

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');

Wenn es Ihnen erfolgreich ermöglicht, ein Popup auf demselben Bildschirm wie das Dokument zu öffnen, das es startet, sollte es mit ähnlichem Aufwand möglich sein, es so zu ändern, dass es sich anders verhält.

Beachten Sie, dass es, wie die Länge des Codes impliziert, keine eingebaute Funktion zum Verstehen mehrerer Monitore in jquery/javascript/browsers gibt, nur dass der Dual-Screen-Desktop einfach eine vergrößerte einzelne kartesische Ebene anstelle von zwei diskreten Ebenen ist.

Update

Der Link ist tot. Verwenden Sie dieser Waybackmachine-Link

18
BrianH

window.screenX gibt die Position des aktuellen Bildschirms an.

angenommen, die Monitorbreite beträgt 1360

für Monitor 1 window.screenX = 0;

für Monitor 2 window.screenX = 1360;

also durch Hinzufügen der linken Position mit window.screenX, Popup in erwarteter Position geöffnet.

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;

}
13
Ravikumar GH

FUNKTION:

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();
   }
}

VERWENDUNG:

PopupCenter('http://www.google.com','google.com','900','500', {toolbar:1, resizable:1, location:1, menubar:1, status:1});

Es funktioniert auch bei minimierten Fenstern

8
dryymoon

Eine javascriptbasierte Lösung funktioniert aus Sicherheitsgründen nicht.

Ich habe eine andere Idee für Sie, warum nicht eine chrome= Erweiterung für die Positionierung verwenden. (Kein Sicherheitsproblem dort) Es ist natürlich nur für Chrom (vielleicht ist das in Ordnung für Sie).

Hintergrund: Wir hatten damit verbundene Schwierigkeiten. Interne Webanwendung, die mehrere Dokumente in Windows öffnet und auf anderen Monitoren platziert werden muss. Das Javascript unterstützt dies aus Sicherheitsgründen nicht und nur eine native Erweiterung kann ordnungsgemäß mit den Tabs/Windows-Objekten arbeiten.

Aus diesem Grund haben wir eine Open Source-Erweiterung chrome) erstellt, um genau das zu tun: Flexible Fensterpositionierung über mehrere Monitore hinweg.

In Ihrem Fall können Sie einfach eine Regel pro Monitor definieren, wo und wie sie angezeigt werden soll. Sie können dies auf der Optionsseite der chrome extension. (Als Shorcut können Sie nach der Installation direkt dorthin gehen sing )

Die Erweiterung chrome heißt "MultiWindow Positioner" und ist komplett kostenlos. Sie erhalten sie im chrome store here

Den eigentlichen Quellcode findest du in github im Projekt chrome-multiwindow-positioner

Haftungsausschluss: Ich bin der Betreuer des Open Source (MIT) Github-Projekts. Wenn es interessante Ideen oder Kommentare gibt, können Sie diese gerne teilen hier .

2
Igor Lino

Keine der oben genannten Lösungen funktioniert ordnungsgemäß. in Bezug auf die genaue Mitte,

Ich habe es versucht, es funktioniert gut für mich in chrome und Firefox

var sY = screenY;
        if (sY < 0) {
            sY = 0;
        }
        var totalScreenWidth = (screenX + window.outerWidth + sY);
        if (totalScreenWidth > screen.width) {
            totalScreenWidth = totalScreenWidth / 2;
        } else {
            totalScreenWidth = 0;
        }
        windowobj.moveTo(totalScreenWidth + ((screen.width - h) / 2), ((screen.height - h) / 2));

Dies ist jedoch auch dann problematisch, wenn der Browser des zweiten Monitors in der ersten Hälfte und in der zweiten Hälfte angezeigt wird.

2
vimal prakash
/**
 * Display popup window in the center of the screen.
 */
function popupWindow(url, title, w, h) {
  // Use window.screenX to center the window horizontally on multi-monitor 
  // setup. 
  var left = window.screenX + (screen.width / 2) - (w / 2);
  var top = (screen.height / 2) - (h / 2);
  return window.open(url, title, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=yes, copyhistory=no, width=' + w + ', height=' + h + ', top=' + top + ', left=' + left);
},
0
Alex Skrypnyk