правильный размер iframe, который содержит изображения неизвестных размеров - PullRequest
Новая
       11

правильный размер iframe, который содержит изображения неизвестных размеров

1 голос
/ 28 апреля 2009

У меня есть веб-браузер C #, который содержит html-страницу с несколькими фреймами. Каждый iframe содержит произвольный HTML-файл, часто с изображениями. Теги img часто не имеют атрибутов ширины или высоты (т. Е. Часто это просто <img src="someimage.jpg">).

Я читал о том, как определять размеры фреймов в зависимости от их содержимого, и заставил их работать с помощью jquery. Следующий фрагмент кода jquery присутствует в HTML-коде iframe: 

$(document).ready(function() {
  $('img').each(function(){ 
        $(this) 
            .bind('load readystatechange', function(e) {
                var iframes = window.top.document.getElementsByName(window.name);
                if (iframes.length == 1) {
                    window.top.DoResizeFrame(iframes[0]);
                }
            })
    });

DoResizeFrame определен в родительском html-файле (тот, который показывает веб-браузер): 

 function DoResizeFrame(fr) {
        if (fr && fr.Document && fr.Document.body) {
            fr.style.height = fr.Document.body.scrollHeight + 'px'; 
            fr.style.width = fr.Document.body.scrollWidth + 'px';
        }
    }

Я также вызываю DoResizeFrame из события $ (document) .ready родительского документа. Это прекрасно работает - если нет изображений, событие готовности документа вызывает изменение размера. Если изображения есть, каждый раз, когда изображение заканчивается, размер фрейма корректно изменяется.

Однако загрузка большого изображения приводит к неправильному размеру iframe до полной загрузки изображения. Поскольку у меня редко есть атрибуты ширины и высоты в теге изображения для работы, я решил, что могу использовать jquery для прослушивания события readystatechange изображения, а когда он «загружается», подобрать размер изображения и правильный размер iframe, даже когда изображение все еще загружается. К сожалению, по крайней мере в IE7, readystatechange = загрузка происходит только после завершения загрузки образа.

У кого-нибудь есть идеи, как я могу определить размер изображения, указанного в моем html, просто с помощью "<img src="someimage.jpg">", не дожидаясь полной загрузки? Я пытаюсь обеспечить наилучшее взаимодействие с пользователем, правильно подбирая размеры, чтобы пользователь мог прочитать остальную часть iframe, даже если загрузка большого изображения занимает некоторое время.

спасибо! жан

1 Ответ

1 голос
/ 28 апреля 2009

Один надежный способ убедиться, это спросить у сервера размер изображения перед его загрузкой. Я сделал это с помощью .net, это довольно просто.

...