CODEWITHSUNDEEP
javascriptgoogle-mapsgoogle-maps-api-3
sammi
sammi

Reputation: 161

Change the center of google maps on browser size

I am a js noob and I want to put in a line of code that changes the center point of my Google map once my browser is < 675px. I am using v3 of the Google maps API.

I have this code so far which doesn't seem to be working.

$(function() {  
  if($('#pgWidth').width() <= 675){
  map.setCenter(new google.maps.LatLng(51.50000 , -0.30000));
  } else {
  map.setCenter(new google.maps.LatLng(51.50000, -0.30200));
  };
});

Upvotes: 0

Views: 191

Answers (1)

Jonathan Sayce
Jonathan Sayce

Reputation: 9679

You need to handle the resize event, rather than only running the code on document ready:

$(window).resize(function() {
  if($(window).width() <= 675) {
    map.setCenter(new google.maps.LatLng(51.50000 , -0.30000));
  } else {
    map.setCenter(new google.maps.LatLng(51.50000, -0.30200));
  };
});

Upvotes: 1

Related Questions