Mouseover et Mouseout écouteur pour Google Maps marqueur

Je voudrais avoir de l'effet de rebond, quand j'passage de la souris sur le marqueur, et arrêter l'animation lorsque mouseleave.

Je suis en train d'utiliser mouseover et mouseout événement sur les auditeurs comme ceci:

google.maps.event.addListener(marker, 'mouseover', function() {
  this.setAnimation(google.maps.Animation.BOUNCE);
});

google.maps.event.addListener(marker, 'mouseout', function() {
  this.setAnimation(null);
});

Mais cette recherche est bizarre.
Je ne peux pas expliquer le mauvais comportement dans paroles - s'il vous plaît voir cette 15 secondes de la vidéo que j'ai enregistrée:

===> http://youtu.be/Hcy8823nNQU

Ce dont j'ai besoin est probablement mouseleave au lieu de mouseout, mais cet événement n'est pas fourni par leur API.

InformationsquelleAutor Stefan Huska | 2013-05-05
  1. 12

    La clé est de mettre uniquement l'animation quand il n'est pas déjà défini, comme:

    google.maps.event.addListener(marker, 'mouseover', function() {
    if (this.getAnimation() == null || typeof this.getAnimation() === 'undefined') {

        /* 
        Because of the google maps bug of moving cursor several times over and out of marker
        causes bounce animation to break - we use small timer before triggering the bounce animation
        */

        clearTimeout(bounceTimer);

        var that = this;

        bounceTimer = setTimeout(function(){
             that.setAnimation(google.maps.Animation.BOUNCE);
        },
        500);

    }
});

google.maps.event.addListener(marker, 'mouseout', function() {

     if (this.getAnimation() != null) {
        this.setAnimation(null);
     }

     //If we already left marker, no need to bounce when timer is ready
     clearTimeout(bounceTimer);

});

    J'ai créé un JS fiddle pour vous.

    Édité:

    Il semble que l'utilisation de marqueurs que draggable: false va rompre la fonctionnalité, donc Si vous voulez de l'animation à continuer à travailler, vous devez ajouter également optimized: false , mis à jour mon violon pour les contenir. Aussi, j'ai vu qu'il y a un bug si le marqueur d'animation est activée et trop vite, ajout d'une petite minuterie pour indiquer avant de commencer à rebondir animation, semble résoudre le problème.

    • Merci pour une réponse rapide. Pour moi, il ne fonctionne pas, décidément j'ai un problème quelque part dans un autre code. Par exemple quand je supprimer les conditions de votre JS fiddle, il travaille toujours.
    • Oooh, je l'ai eu. J'ai besoin d'ajouter "draggable: true", et puis c'est le travail! Regarde, voici votre violon, mais j'ai mis déplaçable à false et que nous voyons le problème que j'ai - jsfiddle.net/Mas4D/1 Mais pourquoi? Je ne veux pas de marqueur pour être déplaçable, hmm.
    • Je réponds en une seconde, il me semblait à trouver peut-être quelques bugs de google maps et comment les surmonter. 🙂
    InformationsquelleAutor Mauno Vähä