изменить размер iframe после отправки внутренней формы - PullRequest
Новая
       2

изменить размер iframe после отправки внутренней формы

1 голос
/ 05 ноября 2011

У меня есть страница с формой внутри iFrame.форма довольно длинная, поэтому iframe длинный.После отправки формы она исчезает, и в верхней части внутренней страницы появляется сообщение.Тем не менее, поскольку начальный iframe слишком длинный, когда пользователь отправляет сообщение, видят почти белую страницу, если только они не прокручиваются вверх.

При отправке формы (в iframe) мне нужно иметь возможность перейти наверх iframe.При успешной отправке я попробовал это (написание jQuery через PHP) в коде успеха: 

echo ("<script type=\"text/javascript\">\r\n");
echo ("$(document).ready(function() {\r\n");
echo ("$(\"html, body\").animate({ scrollTop: 0 }, \"slow\");\r\n");
echo ("});\r\n");
echo ("</script>\r\n");

Но это не сработало (ничего не сделало, и Firebug теперь показал ошибку JS)

Также пытался поместить промежуток, подобный этому, в верхней части страницы iframe: и в форме используйте #top в качестве моего действия, но он тоже не сработал.

Есть мысли о том, чтобы перейти наверхiframe после отправки или «уменьшения» размера iframe в зависимости от его содержимого?

Спасибо!Chris

Ответы [ 2 ]

0 голосов
/ 05 ноября 2011

Вы можете установить обратный вызов загрузки на самом iframe с родительской страницы: 

$(document).ready(function() {
    $("#myIframe").load(function() {
        var iframe = $(this);

        iframe.animate(
            {height: iframe.contents().find("body").outerHeight(true)},
            "slow",
            "swing"
        );
    });
});

Это изменит размер в зависимости от высоты <body> в iframe каждый раз, когда iframe завершает загрузку своего содержимого. Обратите внимание, что это должно быть помещено в docReady на родительской странице.

0 голосов
/ 05 ноября 2011

Вы можете только анимировать свойства CSS, и scrollTop не является одним из них.Я бы сделал это так: 

$(document).scrollTop(0);

Я не уверен, есть ли способ оживить прокрутку, я никогда не сталкивался с этим раньше.

edit: самый простой способ добиться эффекта анимированной прокрутки здесь, вероятно, состоит в том, чтобы анимировать высоту элемента, из-за которой ваш iframe будет очень длинным.Примерно так: 

$('#CONTAINING_EL_ID').animate({height: 20}, 'slow');

Подобный эффект будет выглядеть как прокрутка вверх (хотя на самом деле контент становится только короче), пока все это не уместится в представлении.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...