jquery - InfoWindow not showing above Marker Google Maps JavaScript API v3 -

so have created jsfiddle demonstrating issue: http://jsfiddle.net/6vpc2/1/ hover on marker in jsfiddle see infowindow placement.

i have googlemap "object" creates google maps. after creating google map so:

  var mapoptions = {     zoom: 8, // initial zoom level when map loads (0-20)     minzoom: 6, // minimum zoom level allowed (0-20)     maxzoom: 17, // maximum soom level allowed (0-20)     zoomcontrol: true, // set true if using zoomcontroloptions below, or false remove zoom controls.     zoomcontroloptions: {         style: google.maps.zoomcontrolstyle.default // change small force + , - buttons.     },     //center: location, // centre map our coordinates variable     maptypeid: google.maps.maptypeid.roadmap, // set type of map     scrollwheel: false, // disable mouse scroll zooming (essential responsive sites!)     // of below set true default, remove if set true:     pancontrol: false, // set false disable     maptypecontrol: false, // disable map/satellite switch     scalecontrol: false, // set false hide scale     streetviewcontrol: false, // set disable hide street view     overviewmapcontrol: false, // set false remove overview control     rotatecontrol: false // set false disable rotate control }  if (this.instances.length > 0) {     return this.instances.pop(); }  var googlemap = new googlemap(); googlemap.map = new google.maps.map(googlemap.mapcanvas, mapoptions); return googlemap; 

i set var in js "object" returned googlemap value.

then use this.map, returned googlemap above code, set marker on map:

 this.latitude = latitude; this.longitude = longitude;  var location = new google.maps.latlng(latitude, longitude);  var infowindow = new google.maps.infowindow({     content: placemarkercontent });  this.marker = new google.maps.marker({     position: location,     map: this.map, });  this.map.setcenter(location);  google.maps.event.addlistener(this.marker, 'mouseover', function () {     infowindow.open(this.map, this.marker); });  google.maps.event.addlistener(this.marker, 'mouseout', function () {     infowindow.close(this.map, this.marker); }); 

the problem infowindow not show above marker, see jsfiddle: http://jsfiddle.net/6vpc2/1/ hover on marker in jsfiddle see infowindow placement.

this.marker undefined when using in mouseover listener. inside click listener function, "this" marker.

google.maps.event.addlistener(this.marker, 'mouseover', function () {     infowindow.open(this.getmap(), this); }); 

fiddle