JavaScript animate.css + .js

[magic.dave]

Hi, ich kenne mich schon etwas in html aus aber in Sachen JavaScript bin ich noch ein Neuling.
Ich habe mir bei Youtube ein Tutorial angeguckt (http://www.youtube.com/watch?v=RuhPekX3wsQ) und die "normale" Animation zu Beginn des Videos funktioniert bei mir auch.

Zum Ende hin des Videos wird gezeigt, dass das ganze auch per Hover funktioniert. Dies wird mittels JavaScript realisiert und die Auswahl an Animationen ist doch reichtlich.

Ich habe folgende Zeilen in meine index.html eingefügt:

<script src="jb_scripts.js" type="text/javascript"></script>

Anschließend habe ich noch die jb_scripts.js-Datei angelegt:

$(document).ready(function() {

animationHover('#button', 'tada');

 function animationHover(element, animation){
    element = $(element);
    element.hover(
        function() {
            element.addClass('animated ' + animation);          
        },
        function(){
            //wait for animation to finish before removing classes
            window.setTimeout( function(){
                element.removeClass('animated ' + animation);
            }, 2000);           
        });
};
});

Leider funktioniert das so nicht. Wäre toll, wenn mir jemand bei diesem Problem helfen kann.

Greetz
magic.dave

Ergänzung (25. Mai 2013)

Hm, keiner?

 

[Daaron]

Was sagt denn die JS-Konsole dazu? Schon mal nachgeguckt, ob du keinen Mumpitz geschrieben hast? jQuery ist eingebunden, oder?

Ich frag mich nur grad, wozu man für Hover-Effekte JavaScript braucht... Das ist sowas von unprofessionell. Klick, ja. Da gehts kaum anders... aber Hover?
Und warum dieses Gemurkse mit location.href? Viel eleganter wäre es, der Startseite eine eigene Klasse (z.B. im Body) zu geben und die Animation an diese Klasse zu binden.

 

[Hancock]

Hmm, also du fügst die Klasse animated hinzu, das ist wohl nicht nur JS sondern auch CSS.
Wahrscheinlich lässt sich das ganze komplett in CSS lösen, wenn du #button:hover der animated und tada Deklarationen hinzufügst.

Sonst: IE/Chrome: F12 drücken
FF Firebug installieren und dann F12 drücken.