Изменить высоту фрейма в зависимости от высоты блока в загружаемом документе 
		
		
		
		Здравствуйте. На сайте есть всплывающее окно и страница с формой регистрации. Через фрейм во всплывающем окне показываю эту форму посетителям с предложением зарегистрироваться. Если форма заполнена некорректно, появляются ошибки с указанием, что делать, при этом высота формы становится больше и кнопка "Зарегистрироваться" уезжает за пределы фрейма. Можно как-то динамически менять высоту фрейма в зависимости от высоты блока формы? Код: 
	
<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'; // изменяем высоту фрейма в зависимости от высоты блока во внутреннем документе
}
Что я не так делаю?  | 
	
		
 Цитата: 
	
  | 
	
		
 Вкладка в браузере перезагружается, вроде не ajax. Вот сайт: http://holy-landstore.ru/ чтобы попап увидеть, нужно плашку справа щёлкнуть "Получить 400 рублей". Вот страница регистрации http://holy-landstore.ru/index.php?r...simpleregister Из всплывающего окна я javascript убрал пока, он всё равно не работает. 
	 | 
	
		
 Обработчик onload надо не на document фрейма (который погибает при перезагрузке) вешать, а на сам элемент <iframe> 
	 | 
	
		
 Написал рабочий код с 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? Если не трудно, прокомментируйте код, может я накосячил чего?  | 
	
		
 Цитата: 
	
 iframe.css('height', 50 + 170); А зачем тянуть еще и frameblock? Он же сам растянется чтобы вместить в себя фрейм. Насчет IE - странно. Домен общий? Тогда должно работать.  | 
	
		
 Цитата: 
	
  | 
	
		
 Цитата: 
	
 
  | 
	
		
 Цитата: 
	
 Цитата: 
	
 А так ты можешь на js проверить условие window.top !== window и добавить особый класс для <html>.  | 
	
		
 Цитата: 
	
 Цитата: 
	
  | 
	
		
 Цитата: 
	
 alert(window === window); alert(window === window.window); alert(window === window.window.window.window.window.window.window.window); Я думаю третий вариант в четыре раза правильней второго и в восемь раз - первого :D  | 
	
		
 Цитата: 
	
 Ну а что насчёт "window.top.head.appendChild( <style>Мои стили</style> )"? Я в правильном направлении копаю?  | 
	
		
 Цитата: 
	
  | 
	
		
 Цитата: 
	
 
if( window.top !== window.self ){
	var style = window.top.document.createElement('style');
	style.innerHTML = '.simple-content{background: green;}';
	window.top.document.head.appendChild( style );
}
Но что-то этот код нихрена не работает.  | 
	
		
 Но зачем? Почему бы просто не назначить особый класс? 
	 | 
	
		
 Цитата: 
	
  | 
	
		
 Цитата: 
	
 element.className += ' special-class'; Чтобы назначить класс, например для <html> пиши document.documentElement.className ...  | 
	
		
 Через jquery получается класс вот так добавить: 
	
iframeDoc.find('.simple-content').addClass('h1backgr');
правда селектор тега в Хроме почему-то не работает, т.е. код: 
iframeDoc.find('h1').addClass('h1backgr');
в Хроме не покажет ничего. Всем спасибо за внимание, особенно danik.js  | 
	
		
 Sigizmund2012, 
	:write: А зачем Вы кавыряетесь с фреймом имея jQuery ? Не проще ли данные формы отправлять и получать пост-запросом аяксом из DIV(а), стилизованного под модальное окно, в него же ? Для отправки формы аяксом существует даж специальный объект FormData()  | 
| Часовой пояс GMT +3, время: 08:22. |