Les contrôles de zoom de la carte ne s’affichent pas correctement

J’ai créé une carte simple en utilisant API3. Cependant, les commandes de zoom en haut à gauche semblent “Squashed” – elles ne s’affichent pas correctement. Le rest de la carte va bien. La chose étrange est que j’ai utilisé la même méthode que pour les sites précédents, où les choses fonctionnent bien.

Voici un code:

var directionDisplay; var directionsService = new google.maps.DirectionsService(); var map; var marker; var markersArray=[]; var html; //to create urls var directionsVisible = new Boolean(); directionsVisible = false; function initialize() { directionsDisplay = new google.maps.DirectionsRenderer(); var orchards = new google.maps.LatLng(52.512805,-2.76007); var myOptions = { zoom:14, mapTypeId: google.maps.MapTypeId.ROADMAP, center: orchards, panControl: false } map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); addMarker(orchards); } 

Le problème devrait être dû à l’ img { max-width: 100%; } universel img { max-width: 100%; } img { max-width: 100%; }

Essayez ceci dans votre css

 .gmnoprint img { max-width: none; } 

Au début, je fais face au même problème, puis plus tard je me rends compte

google.maps.event.addDomListener (fenêtre, ‘load’, initialize);

jouer un rôle très important.

Je l’ai ajouté et pour moi ça marche.

Commander le code suivant.

Code CSS

  

Pour JS

   

et final html

 

Si vous utilisez la fonction de grid fluide Dreamweaver, votre configuration par défaut devrait ressembler à ceci:

 img, object, embed, video { max-width: 100%; } /* IE 6 does not support max-width so default to width 100% */ .ie6 img { width:100%; } 

Essaye ça:

 object, embed, video { max-width: 100%; } #map_canvas img { max-width: none; } /* IE 6 does not support max-width so default to width 100% */ .ie6 img { width:100%; } 

il suffit de remplacer le code tel quel.