javascript - Google maps InfoWindow - vertical scroll appers only when using <br/> -
i'm using google maps info window gets populated text 3 input fields. first input field title, sec address (uses standard google autocomplete) , 3rd description. looks user friendly added <br/>
between them each input shown separated in info window. how did it:
return (name || "") + "<br/>" + (addressorcoordinates || "") + "<br/>" + (additionaldetails || "");
but when address little bit longer vertical scroll appears, weird because if write 300 characters in description field, info window doesn't show vertical scroll, nicely adapts infowindow size...
so tried removing <br/>
, works without vertical scroll if address miles long. thought <br/>
messing address, tested litlle bit more , seems address affected <br/>
if infront of adress not if after...
so seems if infowindow contains normal text dosent show verticall scroll if there alot of text , if text separated <br/>
why verticall scroll apperas when using <br/>
infront of adress? there other way can create adress input go new line in infowindow without verticall scroll appearing?
btw css overflow doesn't work , i'm using api v3
so in similar situation were. wanted content within infowindow scroll (just y scroll not x scroll) wanted disable automatic google api infowindow scroll because covering content. many people wrapped infowindow content in div , gave id #info_window. wanted create sure content had maxheight , arranged scroll bar didn't cover content (and needed scroll bar scroll vertically, consideration). finally, used 1 of answers found here ensure scroll bar showing not automatic google one. css ended looking this:
#info_window{ width: 350px; } .gm-style .gm-style-iw, .gm-style .gm-style-iw a, .gm-style .gm-style-iw span, .gm-style .gm-style-iw label, .gm-style .gm-style-iw div { max-height: 280px; padding: 0px 10px 5px 5px; overflow-y: scroll; overflow-x: visible; } .gm-style-iw div { overflow:visible !important; }
javascript google-maps google-maps-api-3 infowindow
No comments:
Post a Comment