Тестирование для нескольких экранов с помощью javascript

Ответ 2 · рейтинг 1 · Algy Taylor

Это слишком сложное решение. Я настоятельно рекомендую провести рефакторинг этого - он не использовался на рабочем сайте, только как быстрое "доказательство концепции" для себя.

Правильно, предостережения закончились.

Сначала я предположил, что у пользователя может не быть установки с двумя мониторами, но у него может быть действительно большой монитор, и поэтому в любом случае можно применить ту же функциональность.

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

Он проверяет, сколько свободного места на экране есть, и, если доступно минимальное количество (800 x 600), открывает окно там. Если места недостаточно, оно перекрывает окно в правой части экрана, занимая примерно половину его.

Заметки:

Во-первых, его следует изменить, чтобы выяснить, где находится максимальное количество места, а не просто произвольно искать слева, справа, сверху, снизу.

Во-вторых, я подозреваю, что в некоторых местах, где используется screen.availHeight, вместо него следует использовать screen.height. Аналогично по ширине. Это потому, что нас не слишком интересует, где находится панель задач, когда мы решаем, есть ли у пользователя второй монитор или нет (или много места на экране).

В-третьих, это не будет работать в IE ‹ 8. Это можно легко исправить, используя screenLeft и screenTop, а не screenX/screenY, где это уместно.

В-четвертых, код беспорядочный, и его можно было бы сделать более элегантным, чем он есть на самом деле. Я не извиняюсь за это. Однако вам НЕЛЬЗЯ нигде использовать такой ужасный, неподдерживаемый JS, и его НЕОБХОДИМО переписать. Я разместил его здесь только потому, что в данный момент я думаю об этом, и я, скорее всего, забуду опубликовать здесь хорошее решение, когда напишу это должным образом, поскольку этого не произойдет в течение нескольких месяцев.

Верно. Ну вот. Я не несу ответственности за то, что ваш javascript стал ужасным, уродливым и совершенно сложным для выполнения каких-либо действий. :)

Ответ 3 · Patcouch22

Я нашел это как решение, которое кто-то использовал ... Я не понимаю, почему вы не могли ему доверять.

[если ширина больше, чем (Высота/3) * 4 > (Экран.Ширина), ТО]

[У пользователя два монитора]

[Конец, если]

Ответ 4 · Armin Ronacher

Вы не можете этого сделать. Однако вы можете расположить всплывающее окно по центру родительского окна. Я думаю, что лучше показать "div" как диалоговое окно в середине вашего веб-сайта, потому что вероятность того, что это всплывающее окно заблокировано, меньше, и это IMO менее раздражает.

Ответ 5 · unexist

А размер экрана? Несколько экранов обычно имеют большой размер. Просто проверьте размеры и решите, разумно ли размещать их только на одном или нескольких экранах.

Ответ 6 · Till

Вы можете сделать хорошо обоснованное предположение с помощью JavaScript screen.width (.availWidth) и screen.height (.availHeight).

Моя идея состояла в том, чтобы предположить (!), что мониторы в целом следуют определенному соотношению, тогда как .[avail]width должен быть за его пределами, потому что экран дублируется только по ширине, но не по высоте.

Однако написание этого ответа звучит как серьезный взлом. Ничего, на что бы я действительно полагался.