Testen für mehrere Bildschirme mit Javascript

Question

Ist es möglich, festzustellen, ob der Benutzer einer Website mehrere Monitore verwendet? Ich muss die Position eines Popups finden, aber es ist sehr wahrscheinlich, dass der Benutzer mehrere Monitore verwendet. Während window.screenX usw. gibt die Position des Browserfensters an, was bei mehreren Monitoren nutzlos ist.

Answer 1

Ich glaube nicht, dass es im Moment möglich ist; allerdings wird js immer beliebter für den Desktop-Einsatz in Widgets zusätzlich zur Web-Entwicklung und das wäre eine ausgezeichnete Funktion für eine zukünftige Version zu beantragen

Answer 2

Dies ist eine übermäßig komplizierte Lösung. Ich würde dringend empfehlen, dies zu überarbeiten - es ist nicht auf einer Produktionsseite verwendet worden, nur als eine schnelle "proof of concept" zu mir.

Gut, die Vorbehalte sind ausgeräumt.

Ich bin zunächst davon ausgegangen, dass der Benutzer vielleicht nicht über einen Doppelmonitor verfügt, aber vielleicht hat er einen sehr großen Monitor, so dass die gleiche Funktionalität trotzdem angewendet werden kann.

var newWindow,
    screenSpaceLeft = window.screenX,
    screenSpaceTop = window.screenY,
    screenSpaceRight = screen.availWidth - (window.screenX + window.outerWidth),
    screenSpaceBottom = screen.availHeight - (window.screenY + window.outerHeight),
    minScreenSpaceSide = 800,
    minScreenSpaceTop = 600,
    screenMargin = 8,

    width = (screen.availWidth / 2.05),
    height = screen.availHeight,
    posX = (screen.availWidth / 2),
    posY = 0;

e.preventDefault();

if (screenSpaceRight > screenSpaceLeft && screenSpaceRight > screenSpaceTop && screenSpaceRight > screenSpaceBottom && screenSpaceRight > minScreenSpaceSide) {
    if (width > screenSpaceRight) {
        width = screenSpaceRight - screenMargin;
    }
    if (posX < (screen.availWidth - screenSpaceRight)) {
        posX = window.screenX + window.outerWidth + screenMargin;
    }
} else if (screenSpaceLeft > screenSpaceRight && screenSpaceLeft > screenSpaceTop && screenSpaceLeft > screenSpaceBottom && screenSpaceLeft > minScreenSpaceSide) {
    if (width > screenSpaceLeft) {
        width = screenSpaceLeft - screenMargin;
    }

    posX = 0;
} else if (screenSpaceTop > screenSpaceRight && screenSpaceTop > screenSpaceLeft && screenSpaceTop > screenSpaceBottom && screenSpaceTop > minScreenSpaceTop) {
    posX = 0;
    posY = 0;
    width = screen.availWidth;
    height = (screen.availHeight / 2.05);
    if (height > screenSpaceTop) {
        height = screenSpaceTop - screenMargin;
    }
} else if (screenSpaceBottom > screenSpaceRight && screenSpaceBottom > screenSpaceLeft && screenSpaceBottom > screenSpaceTop && screenSpaceBottom > minScreenSpaceTop) {
    posX = 0;
    width = screen.availWidth;
    if (window.screenY + window.outerHeight + screenMargin > (screen.availHeight / 2)) {
        posY = window.screenY + window.outerHeight + screenMargin;
    } else {
        posY = (screen.availHeight / 2);
    }
    height = (screen.availHeight / 2.05);
    if (height > screenSpaceBottom) {
        height = screenSpaceBottom - screenMargin;
    }
}

newWindow = window.open(this.href, "_blank", "width=" + width + ",height=" + height + ",location=yes,menubar=no,resizable=yes,scrollbars=yes,status=yes,menubar=yes,top=" + posY + ",left=" + posX);

Es wird geprüft, wie viel Platz auf dem Bildschirm zur Verfügung steht, und wenn ein Mindestmaß an Platz vorhanden ist (800 x 600), wird das Fenster dort geöffnet. Wenn der Platz nicht ausreicht, wird das Fenster auf der rechten Seite des Bildschirms überlagert und nimmt nur etwa die Hälfte des Bildschirms ein.

Anmerkungen:

Erstens sollte sie geändert werden, um herauszufinden, wo der maximale Platz ist, anstatt nur willkürlich links, rechts, oben, unten zu suchen.

Zweitens vermute ich, dass an einigen Stellen, wo screen.availHeight verwendet wurde, stattdessen screen.height verwendet werden sollte. Das Gleiche gilt für width. Dies liegt daran, dass wir nicht übermäßig daran interessiert sind, wo die Taskleiste ist, wenn wir entscheiden, ob der Benutzer einen zweiten Monitor hat oder nicht (oder viel Platz auf dem Bildschirm).

Drittens funktioniert es nicht im IE < 8. Dies kann leicht behoben werden, indem Sie screenLeft und screenTop statt screenX/screenY verwenden, wo dies angebracht ist.

Viertens ist der Code unübersichtlich und könnte viel eleganter aussehen, als er es tut. Dafür möchte ich mich nicht entschuldigen. Allerdings sollte man solch schreckliches, unwartbares JS nirgendwo verwenden und es NEEDS umgeschrieben werden. Ich habe es nur hierher gestellt, weil es mir gerade durch den Kopf geht und ich höchstwahrscheinlich vergessen werde, eine gute Lösung hier zu posten, wenn ich es richtig schreibe, da es erst in ein paar Monaten passieren wird.

Richtig. Das war's. Ich übernehme keine Verantwortung dafür, dass Ihr Javascript schrecklich, hässlich und geradezu schwierig, etwas damit zu tun :)

Answer 3

Ich fand dies als eine Lösung, die jemand verwendet hat... Ich verstehe nicht, warum Sie nicht darauf vertrauen können.

[wenn die Breite größer ist als (Höhe/3) * 4 > (Screen.Width) DANN]

[Benutzer hat zwei Monitore]

[End If]

Answer 4

Das können Sie nicht tun. Sie könnten das Popup jedoch zentriert auf dem übergeordneten Fenster positionieren. Ich halte es für eine bessere Idee, ein "div" als Dialog in der Mitte Ihrer Website anzuzeigen, da die Wahrscheinlichkeit, dass dieses Popup blockiert wird, geringer ist und es IMO weniger störend ist.

Answer 5

Wie sieht es mit der Größe des Bildschirms aus? Mehrere Bildschirme haben in der Regel eine große Größe. Prüfen Sie einfach die Größen und entscheiden Sie, ob es sinnvoll ist, nur einen oder mehrere Bildschirme zu verwenden.