Se connecter / S'enregistrer

Résolu Infobulle en CSS + JS

Solutions (5)
Tags :
  • Index
  • Programmation
|
bonjours a tous,

je fait un site avec des infobulles d'information.

le problème est que je n'ai aucun affichage et je suis persuader que mon code est correct.

voici mon code CSS
  1. /******************************************
  2. * Infobulles
  3. * ****************************************/
  4. span.infobulle {
  5. position: absolute;
  6. margin: 0;
  7. right: 189px;
  8. z-index: 90;
  9. top: 686px;
  10. color: #0033FF;
  11. width: 252px;
  12. height: 51px;
  13. /*overflow: hidden;*/
  14. }
  15. span.infobulle span {
  16. position: relative;
  17. z-index: 99;
  18. display: block;
  19. width: 15em;
  20. padding: 0.5em;
  21. border: 1px solid #ffdc5c;
  22. -moz-border-radius: 8px;
  23. -webkit-border-radius: 8px;
  24. background: #fffece;
  25. color: #9b7601;
  26. font-style: normal;
  27. visibility: hidden;
  28.  
  29. }
  30. #infobulle,
  31. #infobulle_nom,
  32. #infobulle_pseudo,
  33. #infobulle_mail,
  34. #infobulle_password ,
  35. #infobulle_naissance,
  36. #infobulle_langue {visibility: hidden; }



et voici dans mon code en HTML

  1. <!-- Nom -->
  2. <dt><label for="nom">Nom :</label></dt>
  3. <dd>
  4. <input type="text" id="nom" name="nom" value=""
  5. onfocus="document.getElementById('infobulle_nom').style.visibility ='visible';"
  6. onblur="document.getElementById('infobulle_nom').style.visibility ='hidden';" />
  7.  
  8. <span class="infobulle" id="infobulle_nom">
  9. <span>votre mon ne sera pas visible sur le site
  10. </span>
  11. </span>
  12. </dd>
Contenus similaires
Meilleure solution
partage
, Modérateur |
Salut,

Tu caches le span inclus dans infobulle avec du CSS, il faut l'enlever

  1. span.infobulle span {
  2. position: relative;
  3. z-index: 99;
  4. display: block;
  5. width: 15em;
  6. padding: 0.5em;
  7. border: 1px solid #ffdc5c;
  8. -moz-border-radius: 8px;
  9. -webkit-border-radius: 8px;
  10. background: #fffece;
  11. color: #9b7601;
  12. font-style: normal;
  13. }
  • Commenter cette solution |
Score
0
òh
òi
|
Meilleure réponse sélectionnée par guillaume2vo.
  • Commenter cette réponse |
Score
0
òh
òi
|
Merci pour l'aide,
  • Commenter cette réponse |
Score
0
òh
òi
, Modérateur |
Il n'était pas tout à fait bon, la preuve, tu as du changer le visibility:hidden en visibility:inherit pour le span, ce qui revenait au même que de le supprimer.
  • Commenter cette réponse |
Score
0
òh
òi
|
en fin de compte, mon code est bon, je n avais active le java sur ie

en voici la preuve http://membres.multimania.fr/samira2vo/

par contre, qui pourrai me donné un lien pour avoir les gif pour mon site en 50x50 (pour les chiffre 1, 2, 3)

merci
  • Commenter cette réponse |

Ce n'est pas ce que vous cherchiez ?

Tom's guide dans le monde
  • Allemagne
  • Italie
  • Irlande
  • Royaume Uni
  • Etats Unis
Suivre Tom's Guide
Inscrivez-vous à la Newsletter
  • ajouter à twitter
  • ajouter à facebook
  • ajouter un flux RSS