Dimensionamiento dinámico CFWindow para adaptarse al contenido

Question

Actualmente estoy trabajando en un sitio que utiliza muchos objetos CFWindow y me preguntaba si alguien sabe de una forma de cambiar el tamaño dinámico de la ventana para que todo el contenido se ajuste sin la necesidad de barras de desplazamiento.

He intentado usar la configuración de desbordamiento = visible, pero no parece marcar la diferencia.

Gracias de antemano por cualquier consejo.

Answer 1

Bueno, esta es una especie de tarea clásica cuando se usa ventanas emergentes para mostrar imágenes. Se realizó midiendo el tamaño de la imagen y el tamaño del tamaño de la ventana generada por el uso de window.resizeBy(w,h). Creo que este es un método aplicable.

La segunda opción similar es calcular el tamaño necesario en el lado del servidor y pasar al cfwindow atributos width y height. Digamos que puede capturar el contenido en el cfcontent y verifique su longitud en los personajes.

Tenga en cuenta que ambos métodos no son confiables cuando está trabajando con contenido de texto, porque la representación de las fuentes puede ser realmente diferente para los usuarios. Por lo tanto, reservar una altura adicional puede ser útil.

Otra forma difícil es verificar si están presentes las barras de desplazamiento, para la ventana ya abierta. Hay un atributo scrollHeight que puedes comparar con clientHeight y aumentar la altura. Esto posiblemente puede producir algunos efectos feos de "salto" en algunos navegadores, pero debería funcionar.

Estaba interesado y probé la prueba rápida del último método. Primero generado emergente con w/h = 200 y este texto de respuesta (palabras arriba) como contenido. Luego hice esto en la ventana emergente:

<script type="text/javascript">
window.onload = function() {

    // check the size before resize
    alert("Window Width = " + window.innerWidth + "\nWindow Height = " + window.innerHeight + "\nScrollHeight =  " + document.body.scrollHeight);

    if (window.innerHeight < document.body.scrollHeight) {
        // here's where we can play with resize steps and other specific trickery
        // now we're trying to expand size a bit
        window.resizeBy(window.innerWidth + 50, window.innerHeight + 50);
    }

    // check the size after resize
    alert("Window Width = " + window.innerWidth + "\nWindow Height = " + window.innerHeight + "\nScrollHeight =  " + document.body.scrollHeight);

}
</script>

Alerta #1:

Window Width = 200
Window Height = 200
ScrollHeight =  783

Alerta #2:

Window Width = 450
Window Height = 450
ScrollHeight =  358

Tenga en cuenta que no estoy 100% seguro (y no puedo verificar ahora) que window.innerWidth/Height Los atributos funcionarán en IE, debes considerar también document.documentElement.clientWidth/Height atributos.

Espero que esto ayude.