Vlad
Vlad

Reputation: 1167

Google map Addlistener to infowindow

Is it possible to add hover event listener to Infowindow of google maps?

The native events that are available

closeclick, content_changed, domready, position_changed, zindex_changed

I wanted to add hoverOver and HoverOut when the mouse enter Infowindow

Javascript and Jquery suggestions are welcome

Upvotes: 2

Views: 4656

Answers (2)

Vlad
Vlad

Reputation: 1167

I was able to solve my problem by using the .on function of jquery.

var infoWindowContentExampleStack = [
"<div class='contentInsideMap' value='Go'>Im a text inside the infoWindow </div>"
]

var infoWindowExampleStack = new google.maps.InfoWindow({
    content: infoWindowContentExampleStack
});


$(document).on('mousenter', 'div.contentInsideMap', function() {
    // do something
});

$(document).on('mouseleave', 'div.contentInsideMap', function() {
    // do something
});

I wasn't able to test the whole Infowindow but the div I've added in the infowindow is enough trigger.

Upvotes: 2

Ethaan
Ethaan

Reputation: 11376

Is it possible to add hover event listener to Infowindow of google maps?

Yes

How?

Like this.

var infoWindowContentExampleStack = [
"<span id='contentInsideMap' value='Go'>Im a text inside the infoWindow </span>"
]

var infoWindowExampleStack = new google.maps.InfoWindow({
    content: infoWindowContentExampleStack
});

google.maps.event.addListener(infoWindowExampleStack, 'domready', function() {
    document.id("contentInsideMap").addEvent("hover", function(e) {
        e.stop();
        console.log("Yep this event was triggered inside the info!");
    });
});

This is the only solution?

Not, you can add DOM Events directly into Google maps like this

google.maps.event.addDomListener(infoWindowExampleStack, 'hover', initialize);

Take a look, i hope you get the idea

Upvotes: 2

Related Questions