• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

jquery animate() mouseout problem

DBlog

Mitglied
Gelöst jquery animate() mouseout problem

hallo hab folgendes Problem

möchte gern beim mouseover eines spans "menue", den div "sidebar" vom rechten Rand ein wenig nach links animieren und beim mouseout sollte es sich wieder schließen.

bis dorthin funktioniert es auch

nun mein Problem

hab in dem div Links, ist die sidebar ausgefahren schließt sie sich leider wieder sofort, nach dem ich die Maus bewege.
Ich möchte gerne das es im ganzen Div ausgefahren offen bleibt und sich erst beim mouseout vom div schließt.

HTML:
<div id="sidebar_wrap" style="">
    <div id="sidebar" style=" border: 1px solid #333; width:150px; padding: 5 5 5 5; position: fixed; top: 90%; right: -110px; background-color: orange; transition: all 10.8s ease 10s;">
        <span id="menue"><a style="text-decoration: none;color: black;" href="#">Menue</a></span>
        <span>Videos |</span>
        <span>Photos</span>
    </div>    
</div>

Code:
$(document).ready(function() {
    
            //scroll
        
        function showDiv() {
            if ($(window).scrollTop() != 0) {
                $("#sidebar_wrap").fadeIn();
            } else {
                $("#sidebar_wrap").fadeOut();
            }
        }
        $(window).scroll(showDiv);
        showDiv();    
                
            //animation
        
        $('#menue').mouseover(function() {
            $('#sidebar').animate({'right':'-1px'},700);
        });
        
        $('#menue').mouseout(function() {
            $('#sidebar').animate({'right':'-110px'},500);
        });
    
    });
 
Zuletzt bearbeitet:
Werbung:
Werbung:
Zurück
Oben