Изменить высоту фрейма в зависимости от высоты блока в загружаемом документе

[Sigizmund2012]

Здравствуйте. На сайте есть всплывающее окно и страница с формой регистрации. Через фрейм во всплывающем окне показываю эту форму посетителям с предложением зарегистрироваться. Если форма заполнена некорректно, появляются ошибки с указанием, что делать, при этом высота формы становится больше и кнопка "Зарегистрироваться" уезжает за пределы фрейма. Можно как-то динамически менять высоту фрейма в зависимости от высоты блока формы? Код:

<div id="frameblock-simple">
 <iframe id="frame-simplereg" frameborder="0" src="/index.php?route=account/simpleregister" >
    Ваш браузер не поддерживает плавающие фреймы!
 </iframe>
</div>

javascript:

var iframe = document.getElementById('frame-simplereg'); // фрейм
var iframeDoc = iframe.contentWindow.document; // загружаемый во фрейме документ
iframeDoc.onload = function(){ // ждём загрузки документа во фрейме
	var simpleReg = iframeDoc.getElementsByClassName('simple-content')[0]; // блок внутри загружаемого во фрейме документа. Эту строку браузер пропускает без объяснения причин.
	iframe.style.height = simpleReg.offsetHeight + 'px'; // изменяем высоту фрейма в зависимости от высоты блока во внутреннем документе
}

Что я не так делаю?

[danik.js]

Что я не так делаю?

Может у тебя фрейм не перезагружается? То есть форма аяксом отсылается.

[Sigizmund2012]

Вкладка в браузере перезагружается, вроде не ajax. Вот сайт: http://holy-landstore.ru/ чтобы попап увидеть, нужно плашку справа щёлкнуть "Получить 400 рублей". Вот страница регистрации http://holy-landstore.ru/index.php?r...simpleregister Из всплывающего окна я javascript убрал пока, он всё равно не работает.

[danik.js]

Обработчик onload надо не на document фрейма (который погибает при перезагрузке) вешать, а на сам элемент <iframe>

[Sigizmund2012]

Написал рабочий код с jquery, если нужен кому, пользуйтесь, прокомментировал подробно:

$(document).ready( function(){
/* Мозилла и старая Опера не показывают фрейм на той же странице, которая загружается через него, т.е. на странице регистрации, поэтому на ней мы удаляем код всплывающего окна из DOM */
var hostLength = window.location.hostname.toString().length + 7; // находим длину начальной части url: http:// + domain
var windowLock = window.location.href.toString().slice(hostLength); // отсекаем начальную часть url, оставляем "хвост"
if( windowLock === '/index.php?route=account/simpleregister' ){ // если это страница регистрации
	$('#showarcticmodal').remove(); // удаляем код плашки
	$('#arcticmodal').remove(); // удаляем код всплывающего окна
	return;
	}
var iframe = $('#frame-simplereg'); // фрейм
var frameblock = $('#frameblock-simple'); // блок, обрамляющий фрейм
iframe.load( function(){
	var iframeDoc = iframe.contents(); // загружаемый во фрейме документ
	var simpleReg = iframeDoc.find('.simple-content').get(0); // блок внутри загружаемого во фрейме документа(форма регистрации).
	if( !iframeDoc || !simpleReg ){ // IE не даёт доступ к содержимому фрейма, поэтому ставим размеры с запасом
		frameblock.get(0).style.height = '600px';
		iframe.get(0).style.height = '770px';
		}
	else{ // изменяем размер блока с фреймом, в зависимости от высоты формы
	frameblock.get(0).style.height = 50 + simpleReg.offsetHeight + 'px';
	iframe.get(0).style.height = 50 + 170 + simpleReg.offsetHeight + 'px';
	}
})
});

Кто-нибудь знает, как изменять стиль документа внутри фрейма через CSS? Если не трудно, прокомментируйте код, может я накосячил чего?

[danik.js]

Написал рабочий код с jquery

Там от jQuery х*й да них*я. Если уж делаешь, то делай до конца:
iframe.css('height', 50 + 170);

А зачем тянуть еще и frameblock? Он же сам растянется чтобы вместить в себя фрейм.

Насчет IE - странно. Домен общий? Тогда должно работать.

[danik.js]

как изменять стиль документа внутри фрейма через CSS?

А как его изменять не внутри фрейма?

[Sigizmund2012]

Там от jQuery х*й да них*я. Если уж делаешь, то делай до конца:
iframe.css('height', 50 + 170);

А зачем тянуть еще и frameblock? Он же сам растянется чтобы вместить в себя фрейм.

Насчет IE - странно. Домен общий? Тогда должно работать.

1. А как сюда iframe.css('height', 50 + 170) добавить высоту формы simpleReg.offsetHeight, тем более если она может динамически изменяться? Я jquery не знаю почти, мне пока ванильный js ближе, это написал потому, что на сайте весь js через библиотеку эту сделан.
   
2. Не знаю почему, но у меня фрейм не растягивает родительский блок и всплывающее окно схлопывается.
   
3. Выводил в консоль переменные загружаемого во фрейме документа и формы в нём, IE 9 написал, что они не определены. Домен один и тот же.
   
4. Я не хочу страницу регистрации изменять, я хочу только, чтобы она во фрейме по-другому выглядела. Это можно сделать через js, но больно геморройно и по-быдлокодерски как-то, да и ишак не даст по вышеизложенной причине. Кроссбраузерно и просто сделать похоже не получится.

[danik.js]

А как сюда добавить высоту формы

Так и добавляй. Я просто для краткости не добавил. И почему высоту формы? Разве не высоту всего <body>?

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

А, теперь понял о чем ты. Ну по-моему на css нельзя никак. Хотя в голове что-то всплыло - кажется дефолтные стили какого-то браузера. Вроде бы Opera (или хром) как-то выставляет разные стили для отображения ошибки соединения на основной странице и если она отображается во фрейме. Но наверняка там специфичный для браузера селектор.

А так ты можешь на js проверить условие window.top !== window и добавить особый класс для <html>.

[Sigizmund2012]

И почему высоту формы? Разве не высоту всего <body>?

Нет, мне ж не вся страница нужна, а только форма в ней. Весь смысл шаманских плясок вот в чём: если пользователь заполнил форму с ошибками, под инпутами выводятся подсказки "пароль 1234 слишком простой", "введите e-mail" и т.д., которые изменяют высоту формы и кнопка "Зарегистрироваться" уезжает вниз за пределы всплывающего окна. Мой код просто подгоняет высоту окна под новый размер формы.

А так ты можешь на js проверить условие window.top !== window и добавить особый класс для <html>

Вот это не совсем понятно. Код window.top !== window проверяет, не является ли верхний фрейм(он у меня один ) текущей страницей? Кстати в справочнике нашёл запись window.top !== window.window, может она более правильная? Далее, что-то типа window.top.head.appendChild( Сгенеренный мной <style>Мои стили</style> ) ?