IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

Mise en page CSS Discussion :

Affichage fenetre en display block et none + map


Sujet :

CSS

  1. #1
    Futur Membre du Club
    Homme Profil pro
    Inscrit en
    Juillet 2012
    Messages
    4
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Juillet 2012
    Messages : 4
    Par défaut Affichage fenetre en display block et none + map
    Bonjour,

    Je viens soliciter le forum aprés 3 jours de recherche qui n'ont donner que des cheveux blancs (lol) bref... je vous explique mon souci..

    Dans la page de contact de mon site, j'ai mis un bouton qui ouvre une fenêtre avec ma google map, itinéraire etc... jusque là pas compliquer.

    Cette fenêtre s'ouvre à l'aide des propriétés display : block et none...
    voici le code des boutons ouverture et fermeture :

    ouverture :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    <div id="popupBtnOpen" onClick="document.getElementById('popupMap').style.display = 'block'">
        Carte (Map) / Itinéraire
    </div>
    et pour fermer la fenêtre, le même bouton en display:none :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    <div class="popupClose" onClick="document.getElementById('popupMap').style.display = 'none'">
                    Fermer
    </div>
    La fenêtre qui s'ouvre ayant l'ID "popupMap" (pour bien comprendre)
    Dans mon css, sur le div popupMap, je suis obliger de mettre un display:none sinon la fenêtre ne s'ouvre pas...

    MON SOUCI :
    Quand le div popupMap à, dans le css, l'option display sur none, la map qui se trouve dans la fenêtre se s'affiche qu'en partie. genre le div s'affiche en entier mais la map à l'intérieur non.

    J'ai donc modifier, dans le css, en mettant le display sur block, la map s'affiche trés bien, par contre, evidemment, la fenêtre reste sur "ouverte" disons que quand la page est chargée, elle affiche directement la fenêtre ouverte...
    Donc obliger de mettre le display sur none et la je reviens sur : la map est affichée qu'en partie.
    Voici l'adresse, il faut cliquer sur le bouton "map, itinéraire.."

    Voilà donc si vous avez des solutions, je suis preneur car je ne vois plus trés clair aprés tout ce temps passer dessus...

    Vous remerciant d'avance...
    Cordialement,

  2. #2
    Futur Membre du Club
    Homme Profil pro
    Inscrit en
    Juillet 2012
    Messages
    4
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Juillet 2012
    Messages : 4
    Par défaut visibility
    re,

    Je viens de modifier les bouton d'ouverture et fermeture en remplacant les display par des visibility sur visible et hidden..
    du coup dans le css je met sur hidden et je laisse le display block.. de ce fait la map s'affiche et les fenêtres ont le bon comportement...

    reste juste mon boutton d'ouverture qui na plus d'effet (hover)... et une fois que la fenêtre a été ouverte une fois alors il fonctionne.. oula loool
    je continue...

    edit : je précise que c'est tous les hover de tout les bouttons de tout le site qui ne fonctionne seulement une fois que cette fenêtre a été ouverte une fois... bizarre quand même...

  3. #3
    Futur Membre du Club
    Homme Profil pro
    Inscrit en
    Juillet 2012
    Messages
    4
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Juillet 2012
    Messages : 4
    Par défaut re
    Bon, je suis revenu à ma version en display block et none... si quelqu'un a une idée pour solutionner ce soucis...
    merci

  4. #4
    Futur Membre du Club
    Homme Profil pro
    Inscrit en
    Juillet 2012
    Messages
    4
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Juillet 2012
    Messages : 4
    Par défaut re
    re,

    j'ai trouver ses 2 class dans firebug, vous connaissez ?

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    .gmnoscreen { display:none; }
    .gmnoprint { display:none; }
    j'ai tenter des modifs, ca bouge mais je ne parviens pas à trouver le code parfait...
    j'ai tenter le margin:0; le width:100%; je ne sais pas comment faire...

    merci de votre aide

  5. #5
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    17 211
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : Janvier 2011
    Messages : 17 211
    Par défaut
    Bonjour,
    difficile de se rendre compte, le lien fourni est mort.

    MON SOUCI :
    Quand le div popupMap à, dans le css, l'option display sur none, la map qui se trouve dans la fenêtre se s'affiche qu'en partie. genre le div s'affiche en entier mais la map à l'intérieur non.
    Pourquoi ma carte ne s'affiche pas complètement quand je la rends visible ?

Discussions similaires

  1. Utiliser setTimeout avec Display block ou none
    Par BRUNO71 dans le forum Général JavaScript
    Réponses: 9
    Dernier message: 28/01/2015, 19h27
  2. Display:none & Display:block
    Par RicardoBxl dans le forum Balisage (X)HTML et validation W3C
    Réponses: 5
    Dernier message: 11/01/2013, 21h19
  3. Display block/none en cascade
    Par emmeline.a dans le forum Général JavaScript
    Réponses: 12
    Dernier message: 27/07/2010, 12h14
  4. style.display block, none.. IE et firefox
    Par zevince dans le forum Général JavaScript
    Réponses: 9
    Dernier message: 03/08/2006, 15h14

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo