Vous n'êtes pas connecté - 0 membre connecté
Catégories
Graphisme
Flash (64)
Print (81)
Programmation
PHP (112)
ASP (2)
CSS (29)
Hardware
PC (41)
Mac (19)
Linux (8)
Divers
Blabla (346)
1247 Sujets
16531 Réponses
Programmation > CSS > CSS Google Map
CSS Google Map
Salut les filles,

j'ai un petit problème CSS à résoudre

Je suis en train de développer la v2 du site de la collectivité ou je bosse.
Il y a une déclinaison mobile de ce site via @media (max-width: 640px)

sur pas mal de page j'utilise l'API Google Maps v3 afin d'afficher des cartographies réalisées avec nos données.

Sur la version desktop aucun soucis.
Sur la version mobile par contre a priori il y a un petit bug sur iOS (Safari mobile)

En gros pour que mes icones de ma Google Maps soit bien cliquable de bonne manière il me faut ce code CSS sur la div contenant la map

#MaDivContenantMaMap
{
width:280px;
height:auto;
position:absolute;
bottom:0;
}

(ce code est uniquement dans ma media queries "mobile" on est d'accord)

Donc avec ce code ma Google Maps est bien fonctionnelle sur iOS, pas de soucis, par contre au niveau de mon affichage elle viens me defoncer mon site en version mobile en se foutant par dessus tout ...

je n'arrive pas à la mettre a l'endroit voulu et que la fonctionnalité google maps sur mobile ne prenne pas un coup ...
je ne sais pas si je suis bien clair :s
Posté le 05 05 2011 à 14h38
Narno - Modérateur - www

Réponses - CSS Google Map
<< 1 2 >>
j'y connais pas grand chose mais des fois les idées les plus cons fonctionnent...

tu ne peux pas caler ta div par rapport au haut de la page ?

#TaDivContenantTaMap
{
width:280px;
height:auto;
position:absolute;
top: laHauteurDuContenu;
}


'fin bon je dis ça mais je pense que tu as déjà testé et en l'écrivant je suis quasi sur que c'est pas la solution...
Posté le 05 05 2011 à 14h51
nanook - Membre
en mettant un top different de 0, je me retrouve avec mon bug de mes icones dans google maps qui ne sont pas cliquable ... en plus de ca, #MaDivContenantMaMap ne passe pas dans le flux classique et du coup s'affiche au dessus de tout ca et passe par dessus le contenu qui suit.

j'ai essayé de foutre des "clear:both un peu partout sans succès
Posté le 05 05 2011 à 14h55
Narno - Modérateur - www
des p'tits screenshots pour mieux comprendre ce ne serait pas de trop
Posté le 05 05 2011 à 14h59
nanook - Membre
j'en doute pas mais entre les tests depuis un iphone qui n'est pas a moi et un site que je ne peux pas trop diffuser ... :s
Posté le 05 05 2011 à 15h02
Narno - Modérateur - www
remplace ton position:absolute; par un float:left;
mais ouai un screenshot ou un lien ça serait pas du luxe ;)
Posté le 05 05 2011 à 15h04
Geoffroy - Membre - www
j'aurais penser comme nanook, perso.

et si ça n'aurait pas marché, j'aurais fait comme toi, a savoir demandé ici.

(merci pour cette intervention de haute voltige, gUY... tu donnes de faux espoirs par notification interposé)
Posté le 05 05 2011 à 15h04
gUY - Modérateur - www
en foutant un float:left, mon affichage est correct dans google maps mais mes icones ne sont plus cliquable et n'affiche donc pas mes infobulle en fait c'est la zone cliquable qui a l'air de se deplacer vers le haut car si je clique environs 150 px plus haut que mon icone il m'affiche l'infobulle

c'est a rien y comprendre surtout que a priori ca fonctionne sur Android

je virerai le lien asap

a ouvrir depuis un mobile iOS pour voir le pb
Posté le 05 05 2011 à 15h09
Narno - Modérateur - www
dans ce cas nanook top:HauteurDuContenu; pas dans cette div là..
Posté le 05 05 2011 à 15h09
Geoffroy - Membre - www
hmmm et si tu plaçais ta div dans une div ?
ead :

<div id="conteneur">
<div id="tamapgoogle"> </div>
</div >

#conteneur {float:left;}
#tamapgoogle {width:280px; height:auto; position:absolute;bottom:0; }

non ?
edit> des fois en louvoyant ça passe ^^
Posté le 05 05 2011 à 15h12
Geoffroy - Membre - www
f5 , je viens de tenter mais le fait que l'autre soit en absolute le fait sortir du "flux" et donc ne le fou pas a l'interieur de ma div non ?
Posté le 05 05 2011 à 15h16
Narno - Modérateur - www
<< 1 2 >>
Partenaires

Sujets CSS
<< 1 2 3 >>
Pb de menu
Auteur : Pierrot
Posté le 05 12 2011 à 23h16
10 Réponses (Nouveau sujet)
Sujet visité 30183 fois
ohohoh il est beau (...)
Auteur : Geoffroy
Posté le 19 05 2011 à 16h20
8 Réponses (Nouveau sujet)
Sujet visité 7612 fois
CSS Google Map
Auteur : Narno
Posté le 05 05 2011 à 14h38
13 Réponses (Nouveau sujet)
Sujet visité 6634 fois
Framework css
Auteur : Pierrot
Posté le 30 09 2010 à 17h58
3 Réponses (Nouveau sujet)
Sujet visité 7464 fois
menu déroulant
Auteur : MrNaise
Posté le 06 01 2009 à 12h18
12 Réponses (Nouveau sujet)
Sujet visité 22509 fois
Framework CSS
Auteur : Erto
Posté le 04 10 2008 à 11h52
3 Réponses (Nouveau sujet)
Sujet visité 12174 fois
une page en (...)
Auteur : nicosla
Posté le 27 08 2008 à 15h18
6 Réponses (Nouveau sujet)
Sujet visité 11291 fois
IE… de merde !!!
Auteur : Amo
Posté le 09 06 2008 à 15h45
21 Réponses (Nouveau sujet)
Sujet visité 12834 fois
Help !!! Bug menu (...)
Auteur : askhanir
Posté le 03 04 2008 à 13h46
14 Réponses (Nouveau sujet)
Sujet visité 11710 fois
Sorte de fondu sur un (...)
Auteur : Lacrevette
Posté le 26 02 2008 à 22h20
4 Réponses (Nouveau sujet)
Sujet visité 14807 fois
<< 1 2 3 >>
Mentions légales   -   Crédits   -   Nous contacter   -   © Benzor 2006