Меню
Что нового?

Кривая отработка style.height в Firefox'e - xhtml

mrh666

Новичок
Кривая отработка style.height в Firefox'e - xhtml

Приветствую,

Сломал себе мозги, пытаясь приручить Firefox к динамической высоте дива в xhtml transitional. Поиск курил.

Стоит задача сделать "разъезжающийся" по вертикали div. С нуля до 100 точек в высоту.

Код дива:
Код: 
<div class="vnbann" id="flyer" style="visibility: hidden; height:0px;">
	<div id="flyer2" style="visibility: hidden; position: absolute;">
		<a href="#"><img border="0" src="img/468x100.jpg" alt="kartinka" /></a>
	</div>
</div>
Код скрипта:
Код: 
function zresize(){
	if(zheight<100){
		zheight+=5;
		document.getElementById("flyer").style.height=zheight;
		d=setTimeout("zresize()",50);
	}else{
		document.getElementById("flyer").style.height="";
		document.getElementById("flyer2").style.position='static';
		document.getElementById("flyer").style.visibility='visible';
		document.getElementById("flyer2").style.visibility='visible';
	}
}
Вызываю zresize(). В IE все отлично, zheight увеличивая высоту дива flyer отодвигает стоящий под ним блок. В Firefox'e плавного увеличения не происходит. Высота увеличивается мгновенно, рывком.
Выяснилось, что если убрать спецификацию
Код: 
<!--[if !IE]>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<![endif]-->
то все работает корректно.

У кого-то есть идея решения под Firefox при использовании xhtml transitional?
 
Solid

Solid

Drosera anglica
Предлгаю в начале решить данную проблему в FF, а дальше уже подгонять под IE.
 
akxxiv

akxxiv

Новичок
Для высоты должны быть указаны единицы измерения. ИЕ по умолчанию считает что это px, а нормальные броузеры так не думают и требуют обязательного их указания. Поэтому пробуй:

document.getElementById("flyer").style.height=zheight+"px";
 
AmadMike

AmadMike

Новичок
Нет извращение вот это
<!--[if !IE]>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<![endif]-->
Нажмите для раскрытия...
Это вообще полный берд. Либо уж выводить DTD либо нет, но в такой записи смысла просто нет.

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

mrh666

Новичок
akxxiv, огромное вам спасибо! Вы совершенно правы, с прямым указанием "px" все заработало.

AmadMike, безусловный бред, я просто комментировал спецификацию в FF. Проблема решена.

Большое всем спасибо!
 

SelenIT

IT-лунатик :)
Юмор был вот в этом: <!--[if !IE]>... Условные комментарии - IE-only фича (специально созданная и продвигаемая MS как "цивилизованная" альтернатива CSS-хакам). Так что "увидеть" и выполнить код внутри такого комментария по определению может только IE, для остальных - это обычный комментарий.
 
Войдите или зарегистрируйтесь для ответа.
Сверху