jQuery animation

[j4nk3y]

Nabend zusammen,

ich brüte seit einiger Zeit über folgendem Problem und komme mittlerweile nicht mehr weiter/ bzw finde nicht die richtige Stelle in der jQuery Doku.

Zum Fiddle

Ich versuche den Roten div zu verstecken und den Grünen div zu zeigen indem ich über den blauen div mit der Maus hover. Grundlegend funktioniert die Animation zwar aber wird sie zum Ende nicht angehalten. Außerdem wird die Funktion beendet wenn die Maus bewegt wird und dann wieder, wenn der blaue div getroffen wird wieder ausgeführt. Mir ist wohl klar warum dies geschieht aber ich weiß nicht wie ich dieses Verhalten unterdrücke.

Für Anregungen, Tipps oder Lösungen wär ich sehr Dankbar.

Gruß Jo