Redimensionando CFWINDOW dinamicamente para caber no conteúdo

Question

Atualmente estou trabalhando em um site que usa muitos objetos cfwindow e gostaria de saber se alguém conhece uma maneira de redimensionar dinamicamente a janela para que todo o conteúdo caiba sem a necessidade de barras de rolagem.

Eu tentei usar a configuração overflow=visible, mas não parece fazer diferença.

Agradecemos antecipadamente por qualquer conselho.

Answer 1

Bem, esta é uma tarefa clássica ao usar pop-ups para exibir imagens.Isso foi feito medindo o tamanho da imagem e redimensionando a janela gerada usando window.resizeBy(w,h).Este ainda é um método aplicável, eu acho.

A segunda opção semelhante é calcular o tamanho necessário no lado do servidor e passar para o cfwindow atributos width e height.Digamos, você pode capturar o conteúdo no cfcontent e verifique seu comprimento em caracteres.

Observe que ambos os métodos não são confiáveis ​​quando você trabalha com conteúdo de texto, porque a renderização das fontes pode ser muito diferente para os usuários.Portanto, reservar alguma altura adicional pode ser útil.

Outra maneira complicada é verificar se as barras de rolagem estão presentes na janela já aberta.Há um atributo scrollHeight com o qual você pode comparar clientHeight e aumente a altura.Isso pode produzir alguns efeitos feios de "salto" em alguns navegadores, mas deve funcionar.

Fiquei interessado e tentei o teste rápido do último método.Primeiro pop-up gerado com w/h=200 e este texto de resposta (palavras acima) como conteúdo.Em seguida, fiz isso na janela pop-up:

<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 nº 1:

Window Width = 200
Window Height = 200
ScrollHeight =  783

Alerta nº 2:

Window Width = 450
Window Height = 450
ScrollHeight =  358

Observe que não tenho 100% de certeza (e não posso verificar agora) de que window.innerWidth/Height atributos funcionarão no IE - você deve considerar também document.documentElement.clientWidth/Height atributos.

Espero que isto ajude.