I want to hide close button from InfoBox Window in Google Map API, but I have no idea how to do this.
CSS code:
#infobox {
padding: 0 0 8px 0;
margin: -95px 0 0 -15px;
min-width: 180px;
margin-top: 8px;
color: rgb(94, 94, 94);
font-family: Gotham SSm A,Gotham SSm B,Halvetica,sans-serif;
font-size: 12px;
z-index: 1000;
transition: box-shadow .25s;
padding: 1px;
font-size: 12px;
background-color: #ce93d8;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
-webkit-box-shadow: 0 0 8px #9c27b0;
box-shadow: 0 0 8px #9c27b0;
}
JavaScript Code :
infobox = new InfoBox({
disableAutoPan: false,
maxWidth: 150,
pixelOffset: new google.maps.Size(-140, 0),
zIndex: null,
boxStyle: {
background: "url('http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobox/examples/tipbox.gif') no-repeat",
width: "150px"
},
closeBoxMargin: "12px 4px 2px 2px",
closeBoxURL: "http://www.google.com/intl/en_us/mapfiles/close.gif", //close button icon
infoBoxClearance: new google.maps.Size(1, 1)
});
Just set closeBoxUrl
to ""
. According to the docs:
"
closeBoxURL
: The URL of the image representing the close box. Note: The default is the URL for Google's standard close box. Set this property to""
if no close box is required."
You only need to change one line: closeBoxURL: ""
. So your complete code would look like this:
infobox = new InfoBox({
disableAutoPan: false,
maxWidth: 150,
pixelOffset: new google.maps.Size(-140, 0),
zIndex: null,
boxStyle: {
background: "url('http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobox/examples/tipbox.gif') no-repeat",
width: "150px"
},
closeBoxMargin: "12px 4px 2px 2px",
closeBoxURL: "", //THE CHANGE
infoBoxClearance: new google.maps.Size(1, 1)
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With