Плавно увеличивающийся блок

[Ray Hamster]

Знаю, темка заезженная, но полистав форум все же решил зарегаться и описать свою проблему, ибо решения так и не нашел.

Опишу задачу полностью.
Значит, предположим, что есть сайт. Состоит он из 4 дивов 300 на 120 пикселей, которые расположены по центру в два столбика и две строки. В каждом из них есть какая то краткая информация. При нажатия, допустим, на первый блок, он растягивается вниз и занимает полностью первый столбик. Пока он тянется (считанные секунды), краткий контент плавно исчезает, а затем так же плавно появляется полный контент. При повторном нажатии либо активации другого блока предыдущий блок возвращается в исходное положение. 4 див, опять же 'допустим', при нажатии растягивается вверх и влево, тем самым закрывая собой все блоки.

Вот, подробно все описал, так как уже изрядно подз***ался.

Буду крайне благодарен тому, кто поможет.

[melky]

В чём именно у Вас возникла проблема?

[bes]

можно так Плавное увеличение картинки

[Ray Hamster]

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

[Ray Hamster]

Итак)
мне удалось сделать замену дива другим с помощью getElementById
все появляется в нужном месте и размере, как надо. Теперь мне нужно всего лишь сделать плавное появление второго дива.

[Deff]

Ray Hamster,
Наверно setInterval и плавное приращение высоты - вплоть до полной, изначально в css для блока ставите высоту 0
После достижения полной высоты -удаляете id тамера, clearInterval(intervalID) , тем самым завершая его работу

Про setInterval - тут => http://javascript.ru/setinterval

Про изменение высоты элемента =>
document.getElementById("ID").style.height=XXpx

[Ray Hamster]

Deff, а можно подробнее пожалуйста? И пример, если не трудно)
К тому же, нужно изменять не только высоту, но и ширину, да еще и по разным направлениям.
Я использовать getElementById не додумался бы как, если не вытащил бы из примера и не допилил бы под свои нужды

[Deff]

Ray Hamster,
По всем сторонам - не Айс - опробировано - делайте для Высоты

Для начала создайте таймер с окончанием циклов 200/10 (т.е 20 запусков
пусть при запуске выводит alert 10*n ( n - номер запуска) - это и будет текущая высота
Начало скрипта
var n=0;

//тут определяем число циклов
nMax = 200/10 //10 приращение высоты;

var intervalID; //id Таймера - для стиранияж

//Тут таймер;
... тут в функция таймера {
alert('Высота=='+10*n);
n++; //наращиваем n;
}