CODEWITHSUNDEEP
google-maps
gandrap
gandrap

Reputation: 139

move close button to left google maps api

I want to move x button to the top left corner of infowindow.

Is that possible? If not, can I somehow disable it?

I use infoBox

infowindow = new InfoBox({
        content: html
        ,disableAutoPan: false
        ,maxWidth: 0
        ,pixelOffset: new google.maps.Size(12, -29)
        ,zIndex: null
        ,boxStyle: { 
          font: "bolder 12px arial"
          ,width: "300px"
         }
        ,closeBoxMargin: "0px 0px 0px 0px"
        ,closeBoxURL: "http://www.google.com/intl/en_us/mapfiles/close.gif"
        ,infoBoxClearance: new google.maps.Size(1, 1)
        ,isHidden: false
        ,pane: "floatPane"
        ,enableEventPropagation: false
});

Upvotes: 1

Views: 1316

Answers (3)

Chantal
Chantal

Reputation: 33

in Dec 2018 this solution from tohid dadashnezhad still work with a slight change button instead of div

.gm-style-iw + button {
  right: 50px !important;
  left: unset !important;
}

.gm-style-iw + button + img {
  right: 12px !important;
  left: unset !important;
}

Upvotes: 0

Tohid Dadashnezhad
Tohid Dadashnezhad

Reputation: 1948

Add this css code in your style css file

.gm-style-iw + div {
    left: 12px !important;
    right: unset !important;
}

.gm-style-iw + div + img {
    left: 0 !important;
    right: unset !important;
}

Upvotes: 2

hwsw
hwsw

Reputation: 2606

You can define the position of the x with CloseBoxMargin.

I would try something like this:

infowindow = new InfoBox({
        content: html
        ,disableAutoPan: false
        ,maxWidth: 0
        ,pixelOffset: new google.maps.Size(12, -29)
        ,zIndex: null
        ,boxStyle: { 
          font: "bolder 12px arial"
          ,width: "300px"
         }
        ,closeBoxMargin: "10px 280px 0px 0px"
        ,closeBoxURL: "http://www.google.com/intl/en_us/mapfiles/close.gif"
        ,infoBoxClearance: new google.maps.Size(1, 1)
        ,isHidden: false
        ,pane: "floatPane"
        ,enableEventPropagation: false
});

Upvotes: 0

Related Questions