Подскажите пожалуйста новичку!
Вот код:
<html>
<head>
<style>
#outer {
position:absolute;
width:50%;
height:325px;
background-color:lightsteelblue;
display:block;
overflow:hidden;
}
</style>
<script>
function minimaize() {
var relative = document.getElementById("outer");
var sizeHeight = relative.offsetHeight;
if(sizeHeight >= 25) {
sizeHeight--;
relative.style.height = sizeHeight - 9
}
timerID = setTimeout(function() {minimaize()}, 1);
}
function maximaize() {
var relative = document.getElementById("outer");
var sizeHeight = relative.offsetHeight;
if(sizeHeight <=300) {
sizeHeight++;
relative.style.height = sizeHeight + 9
}
timerID = setTimeout(function() {minimaize()}, 1);
}
function change(obj) {
if(document.getElementById("outer").style.height >= 25) {
obj.addEventListener("click", minimaize, false)
} else {
obj.addEventListener("click", maximaize, false)
}
}
</script>
</head>
<body>
<button onclick="change()">Show/Hide</button>
<div id="outer">
</div>
</body>
</html>
Как мне связать две ф-ции вместе, т.е. нажал на кнопку - открылось окно, нажал - закрылось. Но проблема в том что я не изменяю display = "block/none", и не меняю классы, а динамически увеличиваю и уменьшаю высоту элемента DIV, посредством двух функций minimaize() & maximaize(). Я не могу подобрать условие в ф-ции change(). Не хватает у меня винтиков, да и болтиков тоже. Подскажите как одной кнопке, в одном событии можно присвоить две ф-ции, или хотябы распределить их как в ф-ции change(), можно привести другой пример, не обязательно справлять этот, главное чтоб логика была понятна.
Куда и в каком направлении мне двигаться?
Жду Ваших отзывов.
Заранее благодарен!