Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 20.10.2010, 16:22
Аватар для faiwer
Новичок на форуме
Отправить личное сообщение для faiwer Посмотреть профиль Найти все сообщения от faiwer
 
Регистрация: 20.10.2010
Сообщений: 7

onResize() для DIV-a
Доброго времени суток. У меня на сайте дизайн построен по принципу блокнота (faiwer.ru), в нижней правой части может получится небольшой разрыв или наплыв, что не есть хорошо. Написал для решения этой проблемы скрипт, который залатывает дыру отдельным DIV-ом. Повешал выполнение этой функции при Ready() и onResize(). Однако, иногда, блок (который аля блокнот) изменяет свои размеры не изменяя размеры формы, ввиду чего надо заного вызвать мою функцию по залатыванию. Но я не знаю как отследить это событие.

Либо дописывать во все функции, которые могут растянуть DIV, свою функцию, что малореально (да и вообще аморально), либо повешать таймер. Я не уверен, но мне показалось, что мой сайт крашится в IE7 именно из-за таймера, похоже что там происходит переполнение буфера.

Что посоветуете сделать? Как решить проблему?
Вот код функции

function fix_page(){  
	var ext_H = 48; // лишняя высота 
	var one_item = 46; // высота одного полного звена
	var bad_section = 23; // нормальная часть - резерв на всякий пожарный
	var d = document.getElementById("left_column");  
	var c = document.getElementById("cover");
  
	if (!d || !c) return false;
  
	var dy = (d.clientHeight - (ext_H)) % one_item;  
	if (dy < bad_section)  	  
		c.style.bottom=25+dy+"px"
			else c.style.bottom=24+"px";	
	setTimeout("fix_page()", 1000);
}
Ответить с цитированием
  #2 (permalink)  
Старый 22.10.2010, 11:55
Кандидат Javascript-наук
Отправить личное сообщение для Jurasmi Посмотреть профиль Найти все сообщения от Jurasmi
 
Регистрация: 25.11.2008
Сообщений: 115

Прошу прощения, я не понял что за задача:
Решить задачу с версткой (чтобы всё было красиво и правильно)
или
Сделать так, чтобы ваш скрипт в ие7 не крашился?
Ответить с цитированием
  #3 (permalink)  
Старый 22.10.2010, 14:04
Аватар для faiwer
Новичок на форуме
Отправить личное сообщение для faiwer Посмотреть профиль Найти все сообщения от faiwer
 
Регистрация: 20.10.2010
Сообщений: 7

Прошу прощения, я не понял что за задача:
Решить задачу с версткой (чтобы всё было красиво и правильно)
или
Сделать так, чтобы ваш скрипт в ие7 не крашился?

Задача - вызывать fix_page() всякий раз, когда определённый DIV изменяет свои размеры
Ответить с цитированием
  #4 (permalink)  
Старый 22.10.2010, 15:25
Кандидат Javascript-наук
Отправить личное сообщение для Jurasmi Посмотреть профиль Найти все сообщения от Jurasmi
 
Регистрация: 25.11.2008
Сообщений: 115

<html>
<head>
<style type="text/css">
	div{
		background:#ccc;
		max-width:700px;
	}
</style>
</head>
<body>
<div id='test'>
	test test test test test test test test test test test 
	test test test test test test test test test test test 
	test test test test test test test test test test test 
</div>
<script type="text/javascript">
	var div = document.getElementById('test'),
		handler = (function(){
			//чтобы сильно не грузить браузер обработчик срабатывает с задержкой 500мс после ресайза окна
			var timer,
				delay = 500;
				
			return function(){
				if(timer){
					clearTimeout(timer);
				}
		
				timer = setTimeout(function() {
					if(div.offsetWidth != div.widthBefor){
						fix_page();  //ваша функция
					}
					div.widthBefor = div.offsetWidth;
				}, delay);
			};
		})();

		
	div.widthBefor = div.offsetWidth;  //запоминает исходную ширину блока
	window.onresize = handler;  //срабатывает при ресайзе окна браузера
</script>
</body>
</html>
Ответить с цитированием
  #5 (permalink)  
Старый 22.10.2010, 17:59
Аватар для faiwer
Новичок на форуме
Отправить личное сообщение для faiwer Посмотреть профиль Найти все сообщения от faiwer
 
Регистрация: 20.10.2010
Сообщений: 7

Может я несколько недопонял ваш код, но судя по всему он делает тоже самое что и мой:
1. назначает window.onResize
2. вешает таймер
3. по таймеру запускает функцию
Верно?

А этот участок я не понял:

if (timer){
	clearTimeout(timer);
}


У меня почти тоже самое, но как то попримитивнее, таймер я встроил в саму функцию:

$(document).ready(function(){
	$(window).resize(fix_page);
	fix_page();	
});

function fix_page(){  
	// тут код функции, примитивный расчёт
	setTimeout("fix_page()", 1000); // рекурсия	
}


Вроде работает, но это как то "костыльно", что-ли...
Возник ещё 1 вопрос. setTimeout "выходит" из функции или переполняет стек до вылета браузера?)

Ах да. кажется ваш код срабатывает только при onResize окна... у меня сложность заключается как раз в том, что я не могу отследить onResize блока. Блок хоть и большой, но не всегда при его растягивании или стягивании срабатывает onResize() окна.

Последний раз редактировалось faiwer, 22.10.2010 в 18:02.
Ответить с цитированием
  #6 (permalink)  
Старый 08.11.2010, 16:07
Кандидат Javascript-наук
Отправить личное сообщение для Jurasmi Посмотреть профиль Найти все сообщения от Jurasmi
 
Регистрация: 25.11.2008
Сообщений: 115

Цитата:
Блок хоть и большой, но не всегда при его растягивании или стягивании срабатывает onResize() окна.
Честно говоря, не понял как блок может изменить размеры если окно не сжали/растянли? Или блок динамически наполняется контентом? Или ещё как?
Ответить с цитированием
  #7 (permalink)  
Старый 26.06.2012, 15:27
Новичок на форуме
Отправить личное сообщение для Twister55 Посмотреть профиль Найти все сообщения от Twister55
 
Регистрация: 26.06.2012
Сообщений: 1

А почему нельзя поставить функцию на body.onmousedown или mouseup? Ведь если я правильно понял смысл то содержимое не появляется просто так или я ошибаюсь.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Решение проблемы кодировок для AJAX и PHP без iconv (cp1251 в AJAX) Serge Ageyev AJAX и COMET 10 24.04.2013 20:48
Скрипт для динимического изменения div arsen Общие вопросы Javascript 3 30.09.2010 11:29
onresize в Opera ddal.reg Events/DOM/Window 8 30.05.2010 23:29
Не работает AppendChild для div, причём только в IE _Kpot_ Internet Explorer 5 12.02.2009 10:55