Динамически изменение размера CFWindow для соответствия содержанию

Question

В настоящее время работаю на сайте, который использует множество объектов CFWindow, и мне было интересно, если кто-то знает о способе динамически изменить размер окна, чтобы весь контент вписывался без необходимости в полосах прокрутки.

Я попробовал использовать переполнение = видимая конфигурация, но она не имеет значения.

Спасибо заранее за любые советы.

Answer 1

Ну, это рода классическая задача при использовании всплывающих окон для отображения изображений. Это было сделано путем измерения размера изображения и изменение размера порожденного окна с использованием window.resizeBy(w,h). Отказ Это все еще применимо метод, я думаю.

Второй аналогичный вариант рассчитывает необходимый размер на стороне сервера и передается на cfwindow атрибуты width а также height. Отказ Скажем, вы можете захватить содержание в cfcontent и проверьте его длину в символах.

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

Другой сложный способ - проверять, присутствуют ли прокрутки, для уже открытого окна. Есть атрибут scrollHeight с которым вы можете сравнить с clientHeight и увеличить высоту. Это может создать несколько уродливых эффектов «прыжки» в некоторых браузерах, но он должен работать.

Мне было заинтересовано и пробовало быстрый тест последнего метода. Сначала породили всплывающее окно с W / H = 200 и этот ответ ответа (слова выше) в качестве содержимого. Далее я сделал это во всплывающем окне:

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

Предупреждение № 1:

Window Width = 200
Window Height = 200
ScrollHeight =  783

Предупреждение № 2:

Window Width = 450
Window Height = 450
ScrollHeight =  358

Обратите внимание, что я не уверен на 100% (и не могу проверить прямо сейчас), что window.innerWidth/Height атрибуты будут работать в IE - вы должны рассмотреть также document.documentElement.clientWidth/Height атрибуты.

Надеюсь это поможет.