2011-08-08 12 views
5

Tengo una ventana emergente simple que muestra 300x300px imagen, configuré el tamaño de la ventana como 350x350px, pero dependiendo del navegador, o bien obtengo barras de desplazamiento o espacio en blanco adicional. ¿Hay alguna función de jQuery que redimensione la ventana del navegador solo para ajustar el contenido sin barras de desplazamiento o espacios en blanco, sin importar el navegador?jquery cambiar el tamaño de la ventana para que se ajuste a los contenidos

¡Ayúdame!

Respuesta

0

Es probable que el margen/margen de CSS afecte al documento.

hacer:

* { 
    padding: 0; 
    margin: 0; 
    border: 0; 
    outline: 0; 
} 

Eso es un restablecimiento CSS muy sucio hay toneladas en la web acerca restablece CSS si desea una solución más elegante :-)

Pero esperamos que esto le dará una penetración en el problema ..

+0

Esto no está relacionado con CSS, necesito una función para cambiar el tamaño de la ventana del navegador para que se ajuste a los contenidos. – Caballero

+0

Probablemente descubrirá que la razón por la que a veces tiene barras de desplazamiento o espacios en blanco en diferentes navegadores se debe a los modos css y quirk. – Fasani

+0

La razón principal es el tamaño diferente del marco del navegador. Por ejemplo, Firefox tiene un bisel de ventana grueso donde como Opera prácticamente no tiene ninguno. Y si el tamaño de la imagen es 300x300, window.resizeTo (args) hará que toda la ventana sea 300x300, incluidos el bisel, los botones y todo. – Caballero

6

Se podría hacer algo como esto ..

function windowResize() { 
    var contentWidth = document.getElementById("YourImageOrContent").offsetWidth; 
    var contentHeight = document.getElementById("YourImageOrContent").offsetHeight; 
    window.resizeTo(contentWidth,contentHeight); 
} 

Puede que tenga que agregar 20 píxeles más o menos a los valores ... Pero sigo manteniendo mi respuesta original :-D

+0

Intenté algo como esto, pero por alguna razón aún cambia el tamaño de la ventana emergente en cada navegador de manera diferente. – Caballero

+0

Sí, probablemente debido a CSS, cuál fue mi respuesta original. Intenta hacer las cosas * {} arriba, de esta manera debes tener 0 relleno, margen, borde y contorno en todos los elementos que te permitan tener una ventana de tamaño similar en todos los navegadores. (No 100% seguro) – Fasani

+0

document.getElementById ("# YourImageOrContent") es incorrecto. Quite el hashtag –

0

si está sacando una ventana del navegador (eso es lo que entendí) luego en su función de apertura , usted debe hacer algo como esto:

<SCRIPT LANGUAGE="javascript"> 
<!-- 
window.open ('image.jpg', 'newwindow', 'height=350,width=350, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, directories=no, status=no'); 
--> 
</SCRIPT> 

notificación del scrollbars=no

0

Parte del problema que me he enfrentado con este mismo problema es que "resizeTo" cambia el tamaño basa en los fuera límites de la ventana . Eso realmente no ayuda cuando se trata con diferentes navegadores, porque el tamaño de la barra de direcciones será diferente entre los navegadores, y algunos navegadores respetarán la instrucción "location = no", y otros no.

La solución que funcionó para mí (que incluye algunas de jQuery, lo siento, pero que probablemente podría revertir a implementarlo como usted quiera) es la siguiente:

window.resizeTo(422, $('#my-id').height() + (window.outerHeight - window.innerHeight)); 

He probado esto en Safari , Firefox y Chrome, y parece funcionar para todos (no tiene una instalación de Windows, por lo que no puede hacer comentarios para IE).

Cuestiones relacionadas