[jQuery] rozwijane menu

pytanie zadane 5 lipca 2015 w JavaScript przez niezalogowany
edycja 12 lipca 2015

Bry, mam problem z menu. Stworzyłem coś takiego

http://jsfiddle.net/xnehel/5nqy6vwr/

No i jest parę wątpliwości. Normalnie użyłbym slideToggle dla prostokąta niebieskiego i zielonego, ale czytałem, że lepiej jest użyć slideDown (tak samo w przypadku podmenu, ale zostawiłem już slideToggle). I tu się pojawia pierwsze pytanie: gdzie mam użyć slideUp, żeby wrócił na swoją pierwszą pozycję element?

Drugie pytanie dotyczy dodawanie i usuwanie klasy "x". Sprawia ona, że zmienia się kolor czcionki w niebieskim prostokącie po event'cie "click". Gdzie teraz mam użyć removeClass, aby kolor czcionki po ponownym kliknięciu był taki jaki powinien być?

Trzecie pytanie: Moje menu po każdym ponownym załadowaniu strony czy też odświeżeniu, przez jakieś 0.5sec pokazuje całe podmenu, które po chwili chowa (funkcja "hide" i domyślam się, że to jest przyczyna, tylko w takim razie jaka jest alternatywa dla takiego "hide", który NIE BĘDZIE pokazywać całej zawartości podmenu przed kliknięciem przez te 0.5sec?)

Czwarte pytanie: Kiedy kliknie się na niebieski / zielony prostokącik to rozwijane menu ma taki effect odbicia, ale nie wiem za bardzo skąd on się tam pojawił, kiedy jego nie przywołałem (chociaż tu też mam domysł, że to przez funkcję "hide"). Także, jest jakaś inna opcja do naprawienia tego?

Edit1: Znalazłem problem który chrzanił mi po części kod w pyt 4.

Edit2: Solved #3
Aczkolwiek mam wątpliwości. Warto używać własność CSS display: none; ORAZ użyć z JS .hide()?