Prueba para pantallas múltiples con javascript

Question

¿Se puede decir si el usuario de un sitio web está usando monitores múltiples? Necesito encontrar la posición de una ventana emergente, pero es bastante probable que el usuario tenga una configuración de monitor múltiple. Mientras que window.screenX etc. dará la posición de la ventana del navegador, es inútil para múltiples monitores.

Answer 1

No creo que sea posible en este momento; sin embargo js es cada vez más popular para el uso de escritorio en widgets además del desarrollo web y sería una excelente característica para solicitar una versión futura

Answer 2

Encontré esto como una solución que alguien ha usado ... No veo por qué no podías confiar en eso

[si el ancho es mayor que (Altura/3) * 4> (screen.width) ENTONCES]

[usuario tiene dos monitores]

[End If]

Answer 3

Puede no hagas eso Sin embargo, puede colocar la ventana emergente centrada en la ventana principal. Creo que es una mejor idea mostrar un "div" como diálogo en el medio de su sitio web, porque la posibilidad de que esto sea popup bloqueado es más pequeño y es menos molesto.

Answer 4

¿Qué hay del tamaño de la pantalla? Las pantallas múltiples generalmente tienen un gran tamaño. Simplemente verifique los tamaños y decida si es razonable estar en una o más pantallas.

Answer 5

Se podría hacer una conjetura educada con screen.width de JavaScript (.availWidth) y screen.height (.availHeight).

Mi idea era suponer (!) Que los monitores en general siguen una determinada relación, mientras que el ancho. [Disponibilidad] debe estar fuera porque la pantalla se duplica solo en términos de ancho, pero no de altura.

Al escribir esta respuesta, aunque suena como un hack severo. Nada en lo que realmente confíe.

Answer 6

Esta es una solución demasiado complicada. Recomiendo encarecidamente la refacturación de esto: no se ha utilizado en un sitio de producción, solo como una "prueba de concepto" rápida para mí.

Derecha, advertencias sobre.

En un principio, asumí que el usuario podría no tener una configuración de monitor dual, pero podrían tener un monitor realmente grande y, por lo tanto, la misma funcionalidad podría aplicarse de todos modos.

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

comprueba la cantidad de espacio disponible de la pantalla hay, y si una cantidad mínima si está disponible (800 x 600), se abre la ventana de allí. Si no hay suficiente espacio, se superpone a la ventana en el lado derecho de la pantalla, ocupando casi la mitad.

Notas:

En primer lugar, tiene que ser modificado para averiguar dónde la cantidad máxima de espacio es más que simplemente arbitrariamente Buscador de izquierda, derecha, arriba, abajo.

En segundo lugar, sospecho que en algunos lugares donde se ha utilizado screen.availHeight, se debe usar screen.height en su lugar. Del mismo modo para el ancho. Esto se debe a que no estamos muy interesados ​​en dónde está la barra de tareas cuando se decide si el usuario tiene un segundo monitor o no (o mucho espacio en la pantalla).

En tercer lugar, no funcionará en IE < 8. Esto se puede rectificar fácilmente utilizando screenLeft y screenTop en lugar de screenX/screenY cuando corresponda.

En cuarto lugar, el código es complicado y podría hacerse parecer mucho más elegante de lo que realmente es. No me disculpo por esto. Sin embargo, NO debe utilizar un JS tan horrible e irreprimible en ninguna parte, y NECESIDADES para ser reescrito. Solo lo he colocado aquí porque está en mi línea de pensamiento en este momento y probablemente me olvide de publicar una buena solución aquí cuando escribo esto correctamente, ya que no sucederá durante unos meses.

Derecha. Ahí tienes. No acepto ninguna responsabilidad por hacer que su javascript sea horrible, feo y francamente difícil de hacer. :)