bnabriss/google-maps-utility-library-v3

MarkerWithLabel: dom elements inside labelContent

GoogleCodeExporter opened this issue · 1 comments

Hello folks, 
This is the slightly modified version of basic.html example file.
http://www.ressage.com.br/mapa2/basic.html

The marker on the right, has some DOM elements inside its 'mouseover' 
labelContent.. But if you move the mouse over the first label.. it seems to 
trigger the mouseout event.. What causes it to strangely blink 

I can't really get around it ..

The way I'm doing it

var text = 'AAAAAAAAAAAAAAAAAAAAAAAAA<img 
src="http://cdn-careers.sstatic.net/careers/Img/logos/careers-logo.png?v=4daa70d
5b71e">AAAAAAAAAA<br><br>AAAAAAAAAAAAAAABBBBBBBBBBBBBB<p> ALFA </p> 
BBBBBBBBBBBBBBBB<br><br>BBBBB';  
     var html = '<div id="" style="margin-top:2px">'+
                          '<div>'+
                              '<div width="285">'+              

                                      '<div width="90" height="80" align="center" style="vertical-align: top">'+
                                          '<div style="display:inline-block;margin-top: 12px;">'+
                                            '<img src="http://cdn-careers.sstatic.net/careers/Img/logos/careers-logo.png?v=4daa70d5b71e" width="80" height="52">'+
                                          '</div>'+
                                      '</div>'+
                                      '<div width="185" align="left" style="color:#FFF; font: 12px Arial, Helvetica, sans-serif">'+
                                        '<div style="display:inline-block;height:80px;margin-top: 2px;overflow:hidden" title="TITULO DO MARCADOR" alt="ALT DO MARCADOR">'+
                                            '<div style="font-family: arial,tahoma;line-height: 14px;color:white"><strong>TITULO DO MARCADOR</strong><br> 6 quartos<br>Valor: 15000000 <br>Area: 120 m2</p>'+
                                        '</div>'+
                                      '</div>'+                                                                   
                              '</div>'+
                          '</div>'+
                      '</div>';

google.maps.event.addListener(marker1, "mouseover", function (e) {  
console.log('mouseover'); this.set('labelContent',this.labelNovo); });

     google.maps.event.addListener(marker1, "mouseout", function (e) { console.log('mouseout'); this.set('labelContent','abcdefghijklmnopqrstuvxyz') });
     google.maps.event.addListener(marker2, "mouseover", function (e) { this.set("labelContent",html) });

     google.maps.event.addListener(marker2, "mouseout", function (e) { this.set("labelContent",'OUTOUTOUTOTU') });

Browser / Operating System:
[e.g. Chrome/ W8]


*********************************************************
Tip: Star this issue (next to title) to receive notifications of status
changes against this issue, also used as a gauge for how many people are
interested in seeing it resolved.
*********************************************************

Original issue reported on code.google.com by fmmarme...@gmail.com on 25 Sep 2014 at 1:33

Anything?

Original comment by fmmarme...@gmail.com on 29 Sep 2014 at 6:25