XHTMLforum - .mouseleave/ .mouseout

XHTMLforum (http://xhtmlforum.de/index.php)

- Javascript & Ajax (http://xhtmlforum.de/forumdisplay.php?f=83)

- - .mouseleave/ .mouseout - Problem (http://xhtmlforum.de/showthread.php?t=73666)

.mouseleave/ .mouseout - Problem

Hallo,
ich habe eine kleine Navigation mit einem PullDown-Menü. (übrigens mein ersten jQuery, daher wirklich simpel). Jetzt wollte ich erreichen, dass beim Verlassen des Menüs dieses wieder "eingefahren" wird. Ich habe es mit mouseleave und mouseout versucht, aber es klappt nicht.
Kann mir wer sagen, wo der Fehler liegt?

HTML-Code:

<div id="hd_naviOben">

  <ul class="hd_naviObenListe">

        <li id="hd_nOL1">Verkauf

          <ul id="hd_nOL_show1">

                <li class="hd_nOL_but"></li>

                <li class="hd_nOL_but"></li>

                <li class="hd_nOL_but"></li>

                <li class="hd_nOL_but"></li>

                <li class="hd_nOL_but"></li>

          </ul>

        </li>

        <li id="hd_nOL2">Infos

          <ul id="hd_nOL_show2">

                <li class="hd_nOL_but"></li>

                <li class="hd_nOL_but"></li>

                <li class="hd_nOL_but"></li>

                <li class="hd_nOL_but"></li>

                <li class="hd_nOL_but"></li>

          </ul>

        </li>

          <li id="hd_nOL3">Ausstellungen</li>

  </ul>

</div>

Code:

$(document).ready(function(){

    $('#hd_nOL1').click(function(){

            $('#hd_nOL_show1').toggle(150);

        $('#hd_nOL_show2').hide(150);

    })

    $('#hd_nOL2').click(function(){

            $('#hd_nOL_show2').toggle(150);

        $('#hd_nOL_show1').hide(150);

    })

    $('#hd_naviOben').mouseleave(function(){

            $('hd_nOL_show1, hd_nOL_show2').hide(150);

    })

$('hd_nOL_show1, hd_nOL_show2').hide(150); <-- hier fehlt dir zumindest einmal das # bzw . Zeichen.
So wie es hier steht blendest du alle Elemente <hd_nOL_show1> </hd_nOL_show1> und <hd_nOL-show2> </hd_nOL-show2> aus. Du möchtest aber Elemente mit der ID ansprechen.

Kleiner Hinweis noch:
Gewöhne dir doch gleich zu Beginn an, die .on Funktion von jQuery zu verwenden.
Also zB statt $(...).click ist es besser $(...).on('click', function() {[...]} ), bzw. $(...).on('mouseleave', function() {[...]}); etc. zu schreiben. Der Vorteil davon ist, dass du auch mehrere Events kombinieren kannst, also zB $(...).on('click mouseleave', function() {[...]})

Zitat:

Zitat von cloned (Beitrag 553124)

$('hd_nOL_show1, hd_nOL_show2').hide(150); <-- hier fehlt dir zumindest einmal das # bzw . Zeichen.

Autsch... okay, so viel Wissen habe ich eigentlich schon. Hab x-mal nach fehlenden Kommas und Punkten und auch # gesucht, aber da ist es mir nicht aufgefallen. Danke :)

Das mit dem .on werde ich mir merken, auch hier danke :)