Définition d'un mot en une phrase

v4np13 · 8 Septembre 2006

Bonjour,

je cherche la posibilité de donner une définition d'un mot. J'ai essayé avec l'acronym et la propriété hover de a, mais il coupe ma définition à la moitié. Comment pourrais-je contourner cette limite en XHTML/CSS (pas de JS) ? Il faudrait surement que je crée une class definition pour faire aparaitre le texte en dessous, mais je ne vois pas comment je pourrais faire pour afficher/cacher en fonction du :hover (propriété du lien uniquement à ma connaissance).

Merci d'avance

Pierrick

Arkh · 8 Septembre 2006

Peut être un

<a href="">Terme <span>Définition</span></a>

Avec en css:

a
{
overflow:hidden;
}

a span
{
  display:block;
  text-indent:-2000em;
}

a:hover span
{
text-indent:0;
}

Strictement pas sémantique (vive les liste de définitions) et pas encore testé.

Modifié 8 Septembre 2006 par Arkh

ghost · 8 Septembre 2006

Bonjour,

Dans le même style, testé IE et FF


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

 <head>

    <title>Test</title>

<style type="text/css">

 a.bulle {
   text-decoration: none;
   color: red;	
   position: relative;

}

   a.bulle span   {
   display: none;
} 

   a.bulle:hover {
   background: none; /* correction d'un bug IE */
   z-index: 500;
}

   a.bulle:hover  span  {
   color: green;
   position: absolute;
   left: 10px;
   top: 20px;
   background: yellow;
   width: 300px;
   display:inline;
}

    </style>

</head>

<body>
   <p >
     <a class="bulle" href="#"> <span> je suis la définition du mot ...Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi egestas pede ac quam. Etiam lectus elit, vehicula et, ornare in, gravida a, urna. Donec vel ipsum in pede adipiscing scelerisque. Mauris nunc magna, iaculis non, mattis in, commodo at, nibh. Duis ultricies aliquam urna. Duis luctus lorem id est.</span> mot</a>
   </p>
</body>

</html>

Si ça peut t'aider.

v4np13 · 8 Septembre 2006

Merci pour vos réponses

Je testerai dès que j'aurai un peu de temps à moi, je vous tiens au jus

v4np13 · 9 Septembre 2006

Impeccable :thumbsup:

Encore merci

Connexion

Définition d'un mot en une phrase

Sujets conseillés

v4np13

Arkh

ghost

v4np13

v4np13

Veuillez vous connecter pour commenter

Parcourir

Activité