Bonjour à tous.
Je travaille actuellement sur un template pour le CMS Joomla! dans sa version 1.5.
J'ai trouvé un composant sympathique pour un Glossaire, qui détecte les mots présents dans ce glossaire dans les articles et permet au survol de la souris de les afficher.
Le rendu actuel (après quelques modifs CSS) est le suivant:
http://data.imagup.com/9/1122979154.png
Le problème surviens quand ce mot est placé sur le bord de l'article (en bas ou à droite), car la le span est "coupé" en ne s'affiche pas totalement:
http://data.imagup.com/8/1122979252.png
Voici le code en question:
Pouvez vous me dire ce qu'il ne vas pas et comment je pourrais faire en sorte que le bloc s'affiche sur une position différente si le mot est prés d'un des bords ?
Merci à vous.
Je travaille actuellement sur un template pour le CMS Joomla! dans sa version 1.5.
J'ai trouvé un composant sympathique pour un Glossaire, qui détecte les mots présents dans ce glossaire dans les articles et permet au survol de la souris de les afficher.
Le rendu actuel (après quelques modifs CSS) est le suivant:
http://data.imagup.com/9/1122979154.png
Le problème surviens quand ce mot est placé sur le bord de l'article (en bas ou à droite), car la le span est "coupé" en ne s'affiche pas totalement:
http://data.imagup.com/8/1122979252.png
Voici le code en question:
a.glossarylink {
background: url(../images/plugin/ext_popup.gif) 0 4px no-repeat;
padding:0 0 0 12px;
border-bottom: 1px dashed #802A2A;
text-decoration: none;
position:relative;
z-index:24;
}
a.glossarylink:hover {
position: relative;
text-decoration: none;
z-index:25;
}
a.glossarylink span {
display: none;
}
a.glossarylink:hover span {
display: block;
position: absolute;
top: 10px;
left: 0;
width: 18em;
padding: 5px;
margin: 10px;
z-index: 100000;
background-color: #f0f0f0;
border: 1px dotted #c0c0c0;
text-decoration: none;
}
<a class="glossarylink" title="titre" href="/liens-vers-le-glossaire.html">
nous
<span>Contenu du bloc présentant le mot du glossaire (en gris sur l'image)</span>
</a>
Pouvez vous me dire ce qu'il ne vas pas et comment je pourrais faire en sorte que le bloc s'affiche sur une position différente si le mot est prés d'un des bords ?
Merci à vous.