Google Maps iFrame mobile Voir se clipser

Mon client a un site wordpress et une page est Embedding une carte via iframe:Google Maps iFrame mobile Voir se clipser

<iframe 
    src="http://maps.google.com/maps?q=16162+Beach+Boulevard+%23100,+Huntington+Beach&amp;hl=en&amp;pcsi=2051297199499108728,1&amp;geocode=FUCmAgIdBaP3-A&amp;sll=33.728064,-117.988603&amp;sspn=0.006295,0.006295&amp;ie=UTF8&amp;view=map&amp;cid=2051297199499108728&amp;hq=16162+Beach+Boulevard+%23100,+Huntington+Beach&amp;hnear=&amp;ll=33.730729,-117.987242&amp;spn=0.005354,0.006437&amp;z=16&amp;iwloc=A&amp;output=embed" 
    height="350" 
    width="690" 
    frameborder="0" 
    marginwidth="0" 
    marginheight="0" 
    scrolling="no"> 
</iframe>

Quand je regarde la page dans mon iPhone, il rend convivial mobile et redimensionne la iframe pour s'adapter à la fenêtre, mais l'état et le code postal sont coupés. J'ai essayé d'ajuster la hauteur de la iframe et aussi le rembourrage du bas, mais il semble être quelque chose à la fin de Google. Une idée de comment résoudre ce problème? J'ai ajouté une bordure bleue à mon iframe vous pouvez donc voir que ce n'est pas le iframe qui sature le texte:

Example screenshot

Source

2013-02-06 Maverick

pouvez-vous poster le lien en direct? –

Une chance de résoudre ce problème? Btw, la prime a déjà expiré. – JSuar

Pas de chance:/Gaspillage de 50 rep – Maverick

Je recommande affichant un lien vers le site ou l'affichage certains des CSS. Cela permettrait à la communauté SO de résoudre plus facilement le problème. J'ai répliqué votre problème en supprimant l'attribut iframewidth="690". Je soupçonne que le CSS Wordpress ou du JavaScript est en train de surcharger la largeur iframe et de tout bourrer dans la largeur de l'écran de l'iPhone.

Pour remplacer le redimensionnement automatique, je viens de donner iframe un id et de définir la largeur explicitement dans mon CSS.

#WidthTest { 
    width:690px; 
}

Peu importe, je suis sûr que vous pouvez trouver une solution similaire en creusant dans le Wordpress CSS/JavaScript.

Source

2013-02-17 21:49:50 JSuar

Je vois qu'il ne cache plus le texte encapsulé mais qu'il saigne du bord de l'écran du téléphone avec la correction de largeur. – Maverick

@Maverick, vérifiez à nouveau le site. Il est clair que la solution fonctionne en fonction de votre réponse. Vous avez juste besoin de définir la largeur appropriée afin qu'aucune saignée ne se produise. Définir la largeur permettra d'éviter le problème que vous signalez dans votre question. – JSuar

-1

J'ai modifié le code. Cela fonctionne très bien pour moi! Vous voudrez peut-être changer la largeur en fonction de vos besoins.

<iframe width="380" height="500" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.com/maps?q=16162+Beach+Boulevard+%23100,+Huntington+Beach&amp;hl=en&amp;pcsi=2051297199499108728,1&amp;geocode=FUCmAgIdBaP3-A&amp;sll=33.728064,-117.988603&amp;sspn=0.006295,0.006295&amp;ie=UTF8&amp;view=map&amp;cid=2051297199499108728&amp;hq=16162+Beach+Boulevard+%23100,+Huntington+Beach&amp;hnear=&amp;ll=33.730729,-117.987242&amp;spn=0.005354,0.006437&amp;z=16&amp;iwloc=A&amp;output=embed"></iframe>

Source

2013-02-18 06:42:22

Google Maps iFrame mobile Voir se clipser

Répondre

Questions connexes