Rozbudowane, rozwijane menu

Question

Mam takie coś: http://jsfiddle.net/xnehel/t8g62cde/

Chce, żeby po kliknięciu na prostokącik, czarne prostokąciki się rozwinęły w dół zaraz za prostokącikiem. Problem jest taki, że się z nim pokrywają. Próbowałem z margin-top, ale bez żadnych efektów..

Chcę też sprawić, żeby szare prostokąty pojawiły się dopiero po kliknięciu na czarny prostokącik, a nie odrazu były rozwinięte. Niby ustawiłem display:none; ale nie chciało to ze mną współpracować. Ustawiłem w JS .hide(), ale to tylko "starało się" wyświetlić listę, która koniec końców nie wyświetlała się w ogóle.

I ostatnie pytanie, co mam zrobić, żeby szare kwadraciki się nie zwijały do czarnego kwadracika, kiedy się na nie kliknie?

Answer 1

Proszę: https://www.youtube.com/watch?v=vd_GnTBzJ4U

Polecam obejrzeć cały film (Pana Mirosława jakby coś)

Comments

Tak, a ja polecam zapoznać się z różnicą między "hover" a "click".