My favorites | Sign in
Project Home Issues
New issue   Search
for
  Advanced search   Search tips   Subscriptions
Issue 1531: height of infoWindow grows with each open
3 people starred this issue and may be notified of changes. Back to list
Status:  Fixed
Owner:  d.l%[email protected]
Closed:  Sep 2009


Sign in to add a comment
 
Reported by [email protected], Jul 28, 2009
Height of the opened infoWindow is increase with each opening of the window.

What steps will reproduce the problem?
Set the content of the infoWindow using following DOM node:
<div id="info_window_content"><h3><strong>TEST</strong> Title</h3><p>A
paragraph.</p></div>

I.e. using JS code like this:
var contentElem =
document.getElementById("info_window_content").cloneNode(true);
var infowindow = new google.maps.InfoWindow({content: contentElem});


Problem is only if the content of the div starts with certain elements,
like <h3> or <p>, disappears if first element is e.g. <span> or <br>.


What version of the API are you using?
3


What operating system and browser are you using?
Windows XP, SP3
Firefox 3.5.1
Aug 6, 2009
#1 d.l%[email protected]
(No comment was entered for this change.)
Aug 11, 2009
#2 d.l%[email protected]
(No comment was entered for this change.)
Labels: -ApiType-Javascript ApiType-Javascript3
Aug 11, 2009
#3 d.l%[email protected]
It sounds uncertain that this is an issue with the API or a glitch in the way HTML is
rendering in the browser.

Can you reply back with a link to a more complete example that isolates the problem?

Thanks!
Status: NeedsMoreInfo
Aug 12, 2009
#4 [email protected]
Example showing the ill behavior:
http://www.artprodesign.com/gmaps-example1

Just click on the icon subsequently to see the window's height grow.

Workaround using <br /> tag in the beginning of the infoWindow content:
http://www.artprodesign.com/gmaps-example2
Aug 29, 2009
#5 [email protected]
Another possible workaround is avoiding using DOM node completely for content and
using the innerHTML property to retrieve the content in string form. I.e. instead of:

var contentElem =
document.getElementById("info_window_content").cloneNode(true);

using:

var contentElem =
document.getElementById("info_window_content").innerHTML;

However documentation says:
---quote---
The InfoWindow options object is an object literal containing the following fields:

    * content contains either a string of text or DOM node to display within the info
window when it is opened.
---end quote---
... so it should work equally well with string and DOM node.
Sep 1, 2009
#6 d.l%[email protected]
Thanks for the test link.  I reproduced the issue and confirmed the issue occurs
whenever InfoWindow.open() is called.

The problem I found was related to <p> elements inside the info window's content
node.  I experimented with setting content using an HTML node and also with an HTML
string, both containing just a single <p> tag.  I reproduced the buggy behavior in
both cases.

I've experienced some odd behavior using <p> tags in other contexts, e.g. Google
Gadgets + dynamic height.  So there's definitely something quirky going on here. 
We'll take a look.


Thanks for filing the issue.
Status: Confirmed
Labels: Internal-2093080
Sep 3, 2009
#7 d.l%[email protected]
(No comment was entered for this change.)
Status: FixedNotReleased
Sep 11, 2009
#8 d.l%[email protected]
(No comment was entered for this change.)
Status: Fixed
Labels: Fixed-14
Sep 12, 2009
#9 [email protected]
InfoWindow indeed stopped growing, but there is another problem. For cases when it
used to grow, it now incorrectly autodetects the height of the infoWindow (it should
be slightly taller, the bottom margin is non-existent). Again it happens only if the
content of infoWindow starts with certain tags (<p>, <h3>, etc.), all is ok if the
content starts with e.g. <br />. And imho, it's not strictly bound to <p> tag, but
rather to certain types of tags (and it only matters what is in the beginning of the
content).
Again you can check links:
http://www.artprodesign.com/gmaps-example1
http://www.artprodesign.com/gmaps-example2
2nd link has just extra <br /> tag in the beginning of infoWindow content, other than
that it's identical to 1st.
Sep 12, 2009
#10 [email protected]
I've tested another thing. If you just change <h3> to <div> or <span>, then the
bottom margin is too large, as this link shows:
http://www.artprodesign.com/gmaps-example3

So the summary is: If the infoWindow content begins with:
<p>, <h3>, ......... then bottom margin is too small (practically non-existent)
<div>, <span> ...... then bottom margin is too large
<br />, <hr /> ..... then the margins work correctly
Sep 17, 2009
#11 d.l%[email protected]
Interesting.

Would you mind filing this in a separate issue?
Sign in to add a comment

Powered by Google Project Hosting