[Nailya]

Всем доброго времени суток!

У меня раздвигающийся блок вниз, по клику.
Проблемы следующие:
1. Работает в FF и от IE9, в остальных не хочет работать.

2. Для IE8 использовала obj.currentStyle, но он работает при условии, что в стилях задана высота, а у меня высота раздвигающегося блока динамична, если высоту не задаю в стилях, то при алерте передает NaN

3. В IE8 не передает высоту в скрытый див, подозрение на innerHTML

4. В Chrome тоже не работает, высоту в скрытый див innerHTML передает,но не получает его (mt = objWarpHeight.innerHTML)



Вот код:

window.onload = function(){
var obj = document.getElementById('Inner');//разворачиваемый див
var computedStyle = window.getComputedStyle ? getComputedStyle(obj,null) : obj.currentStyle;
var height = parseInt(computedStyle.height);//получение текущей высоты дива с id="Inner"
var objWarpHeight = document.getElementById('warpHeight');//скрытый див
objWarpHeight.innerHTML = height;//вставка высоты в скрытый див
obj.style.height = 0 + "px";//при загрузке обнуляет высоту
}

Функция, которая разворачивает див

function move_obj(id,mt,mts)
{
	var obj = document.getElementById(id);
	var computedStyle = window.getComputedStyle ? getComputedStyle(obj,null) : obj.currentStyle; 
	var height = parseInt(computedStyle.height);//получает текущую пошаговую высоту
	if (mt == 10000 && height == 0)//при условии, если высота равна 0, то разворачивает див 
	{
	var objWarpHeight = document.getElementById('warpHeight');//передаем высоту из скрытого дива
	mt =  objWarpHeight.innerHTML;//в переменную mt передается значение высоты
	} 
	if (mt == 10000 && height != 0)//при условии, если высота не равна 0, то сворачивает див
	{
		mt = 0;
		mts = mts*(-1);
	}
	if ((height < mt && mts > 0 )||(height > mt && mts < 0 ))
	{
		height = height+mts;
		obj.style.height = height + 'px';		
				
	// Ниже запускаем тайм аут в 1 мс, после чего перезапускаем фунvкцию.
	// Функция перезапускается до тех пор, пока выполняется условие.	
		window.setTimeout(function(){move_obj(id,mt,mts)}, 1);
	} 
}

<div id="wrap">
	<div class="pic" onClick="move_obj('Inner',10000,5)">ещё компоненты</div><!--клик-->
		<div id="Inner">
			<pre>
				<input type="checkbox" name="3" value="yes" checked> Виноград
				<input type="checkbox" name="4" value="yes" checked> Ананас
				<input type="checkbox" name="7" value="yes" checked> Апельсин
				<input type="checkbox" name="3" value="yes" checked> Виноград
				<input type="checkbox" name="4" value="yes" checked> Ананас
				<input type="checkbox" name="7" value="yes" checked> Апельсин
				<input type="checkbox" name="4" value="yes" checked> Шоколад
				<input type="checkbox" name="4" value="yes" checked> Каша
				<input type="checkbox" name="7" value="yes" checked> End
			</pre>
		</div>			
	</div><!--end #wrap-->

#wrap{overflow:hidden;}
	#wrap pre{
		margin:0 -170px;
		padding-top:10px;
	}
	#wrap .pic{
		width:284px;
		padding:3px 0;
		background:pink;
		text-align:center;
	}
	#wrap #Inner{
		width:284px;
		background: url("PodborBlock/innerBack.png") repeat-y;
	}