mouseover / mouseout et animations

Y0ann
Javascript

Bonjour à tous !

Rien ne vaut un codepen.io pour illustrer mon problème.
http://codepen.io/anon/pen/gbBrJV

Alors voilà, au survol du lien, j'ai une petite animation qui s'effectue... Sauf que si l'utilisateur survol l'élément de cette animation ( à savoir le hr )... Et bien, le mouseout sur la balise a se déclenche... Et l'animation est du coup assez... moche ! :)

Avez-vous des idées pour parer à ce problème ?

Je vous remercie d'avance !

Yoann

3 réponses

Yentia

Salut,

Si j'ai bien compris ton problème, en ajoutant 

$('hr').mouseover(function(){
  $('hr').removeClass('bounceOutDown');
  $('hr').removeClass('bounceInUp');
});

$('hr').mouseout(function(){
  $('hr').removeClass('bounceOutDown');
  $('hr').removeClass('bounceInUp');
});

Cela arrange deja un peu la chose :)
En esperant que cela aide

Y0ann
Auteur

Merci pour ta réponse, mais pour ma part, je trouve que cela ne résout pas le problème... le mouseout sur la balise "a" se déclenche quand même... et c'est ça qui pose problème ;-/

Y0ann
Auteur

Du coup la solution que j'ai trouvé c'est de jouer avec la position absolute des éléments...
http://codepen.io/anon/pen/gbBrJV

Donc bref... Je pense que c'est la seule solution ?