Can we make the Googlemap infowindow, responsive so that its size change according to the size of the browser window?

Question

I am placing a map on a responsive html page. It has a marker and an infowindow. I am using the code like this

My map_canvas has a width which will get adjusted according to the width of the media. It is styled using @media tag.

I wand to increase or decrease the size of the info window according to the media size.

Is that possible?

Answer 1

An infoWindow always has a fixed size, calculated before it opens. By that, a CSS-solution will not work here.

What you can try: Listen for the resize-event of the window and reopen the infoWindow:

google.maps.event.addDomListener(window, 'resize', function() {
          infowindow.open(map);
        });