11496 sujets

JavaScript, DOM et API Web HTML5

bonjour,

j'ai un css qui definit 2 div : photo et lexique

dans "photo" j'affiche une image sur OnmouseOver

et sur "lexique" je désire afficher du texte sur OnMouseOver d'un titre.

L'affichage du div photo fonctionne très bien mais pas l'autre et ne trouve pas pourquoi...

Si vous pouviez m'aider, ce serait super sympa !

Merci

Css :


#conteneur .photo {
  position:fixed;
  top:270px;
  left:90px;
  border:1px solid #FFFFFFF;
  background-color:#FFFFFF;
  padding:5px;
  display:none;
  -webkit-box-shadow:0px 0px 5px 2px #666;
     -moz-box-shadow:0px 0px 5px 2px #666;
       -o-box-shadow:0px 0px 5px 2px #666;
          box-shadow:0px 0px 5px 2px #666;
}


#conteneur.lexique /* div où s'affiche la définition du lexique de chaque affection  */
{
 position:fixed;
  top:270px;
 left:90px;
    text-align: justify;
    font-size: 1.em;
    color: #000;
    font-family: "Lucida Console", "cosmic sans";

      border:1px solid #FFFFFFF;
  background-color:#000000;
  padding:5px;
  display:none;
  -webkit-box-shadow:0px 0px 5px 2px #666;
     -moz-box-shadow:0px 0px 5px 2px #666;
       -o-box-shadow:0px 0px 5px 2px #666;
          box-shadow:0px 0px 5px 2px #666;



lien pour div photo de l'image :


<div id='texte'>Le point se trouve à <div id='conteneur'><a href='#'><img class='photo' src='ressources/2TRAVERS.JPG' alt=''>2 travers de doigts</a></div> appliqués verticalement à partir de la 11ème épine osseuse (<div id='conteneur'><a href='#'><img class='photo' src='ressources/VERTEBRES_THORACIQUES.JPG' alt=''>vertèbre thoracique</a></div>) que l'on peut sentir quand on baisse la tête.</div></P>


affichage texte sur div 'lexique' :


<div id =depress>

<div id='conteneur'><b><a href='#' onmouseover='document.getElementById('lexique').style.display='block';document.getElementById('lexique').innerHTML='la dépression nerveuse est en fait la diminution ou le ralentissement du tonus de l'activité neuropsychique. elle peut conduire à un affaiblissement du domaine physique. '; ' onmouseout='document.getElementById('lexique').style.display='none''>Dépression nerveuse </a></b></div></div>

Salut,

En vrac, et sans avoir cherché à faire fonctionner ton code :
- les valeurs des attributs id sont censées être uniques sur une même page. Donc répéter id="conteneur" c'est une erreur. Utilise l'attribut class à la place.
- les valeurs des attributs sont censées être entre guillemets (idéalement des doubles, c'est plus standard, même si les simples sont ok), donc <div id =depress> c'est pas bon.
- les valeurs des attributs sont censées être entre guillemets de même type (simples ou doubles), donc quand tu écris onmouseover='document.getElementById('lexique')blabla, tu déclares en réalité onmouseover='document.getElementById(', ce qui suit étant du domaine de l'erreur. Utilise par exemple des guillements doubles pour encadrer toute la valeur de onmouseover, et des guillemets simples à l'intérieur. Même chose pour onmouseout, bien sûr.
- mettre des div (élements de type bloc) en plein milieu d'une phrase, c'est pas forcément la meilleure idée possible. Préfère des <span>, voire rien du tout puisque tu as déjà des <a>, ça doit suffire.
- la fonte "cosmic sans" n'existe pas. Tu cherches probablement "Comic Sans MS".

Une fois ces points corrigés, on y verra plus clair. Reposte ton code ou idéalement donne un lien vers une version complète en ligne.