Каскадное отображение блоков dom с js
 

Устал уже бороться с этим dom методами css - нужна ваша помощь. В общем несколько блоков на странице скрыты при помощи css display: none. При наведении мыши они появляются, но появляются один под другим, т.е. слоями. Естественно, видимым становится только верхний. Как при помощи js раздвинуть эти блоки каскадом по высоте каждого и сразу следующий? Т.е.

<div class=div></div>
<div class=div></div>
<div class=div></div>
<div class=div></div>
...

Всем спасибо!

Блоки так ведут себя по умолчанию... Располагаются друг под другом. Это уже ты чего-то намудрил в css.

Ясен пень, что так ведут. Но они скрыты и накидываются динамически. Поэтому открываются все в одном месте слоями. Мне надо их раскрывать типа аккордеоном

$('.media-message').each(function(index, element) {  
                        // Вычисление смещения на основе высоты текущего элемента и другого элемента, выбранного по селектору.  
                        var height = $(element).height() - $(otherElement).height();  
                        $(element).css('top', height + 'px');  
                        });

Вот что-то подобное нужно. Но не срабатывает почему-то

При display none на элемент невозможно навести курсор, только на координаты предположительного расположения элемента. Также при display none размеры элемента (ширина, высота) равны 0.
CSS-свойство height описывает не какое-либо смещение элемента, а именно его высоту.

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