使Google Maps Marker在所有视口中居中

Question

Not even sure if the following is possible, haven't found anything yet to confirm either way on the net so far

I am using this to display my map

<iframe width="100%" height="100%" frameborder="0" scrolling="no" marginheight="0"     marginwidth="0" src="https://maps.google.co.uk/maps?f=q&amp;source=s_q&amp;hl=en&amp;geocode=&amp;q=NP19+7GA&amp;aq=&amp;sll=52.405331,-4.159948&amp;sspn=5.732167,16.907959&amp;ie=UTF8&amp;hq=&amp;hnear=NP19+7GA,+United+Kingdom&amp;ll=51.595904,-2.979781&amp;spn=0.011397,0.033023&amp;t=m&amp;z=14&amp;iwloc=near&amp;output=embed"></iframe>

It is taken off the google maps webpage as you can probably tell. So far it fills 100% of the screen, which is fine but I am implementing in a responsive website and was wondering if when changing the size of the viewport the marker that is generated can stay centered.

at the moment the map shrinks as the viewport does but you lose sight of the marker (location)

EDIT

If I use the google maps api V3 i can add an event listener like so

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

Is there a way in Jquery to create this function?

Answer 1

jQuery is javascript, as is the GMaps API. Just put the code above in with your other js.

You could rewrite it to use a jQuery event, but there would be no benefit in doing so.