infowindow V3 with jquery tabs with correct resizing

[Roman]

We have find out solution how to finally always show correct size of
infowindow with jquery tabs, without annoying scrollbars or
anything :)

The trick is that you have to create element and inside that element
you have to apply tabs() function!! And then result set like a content
of infowindow.. maybe you also want to get tab with longest height
and set it to the first tab(which is used to set height of infowindow)


Here is the important part of code:


var contentString //your code usable for creating jquery tabs

google.maps.event.addListener(marker, 'click', function() {
var div = document.createElement('div');
div.innerHTML = contentString;
$(div).tabs();
infowindow.setContent(div);
...


});

[xelawho]

> We have find out solution how to finally always show correct size of
> infowindow with jquery tabs, without annoying scrollbars or
> anything :)

nice. seems to work for properly sizing infowindows with non-jquery
content as well (but I have been wrong on this one before).

[Ralph]

Maybe you could post a link to demo page so we can see your solution in
action.

Ralph

[MymsMan]

I have been using a variation of this technique (not using jquery) with a reasonable degree of success but have encountered a few minor niggles mainly related to Internet Explorer.

• Sometimes with large infowindow content it overflows the bottom of the window and I have not yet worked out a scheme for predicting when that will occur or suitable CSS styling for conditional scroll bars (It hasn't been a priority to solve)
• I am building multiple markers and infowindows in a loop and it was fine in Firefox, Chrome, Safari but in IE I found that the infowindows were blank apart from the last.  It appeared for some reason the setContent hadn't worked.   This was easily fixed by adding to the click handler for the marker a condition setContent                                   
                         if (document.getElementById('content'+ix))
                                      {
                                         evntObj.infowindow.setContent(document.getElementById('content'+ix));                                    
                                      }
• IE9 is as good as the other browsers for not overflowing windows but IE8 is particularly prone to overflowing or if given scroll bars formatting a window with room only for scroll bars with no visible text!