Une infobulle sans javascript (si possible) et sans lien

Bonjour,

Comme indiqué dans ce post j'ai quelques soucis avec la balise title. Je me suis donc décidé à faire mes propres infobulles. Une recherche sur le net m'a permis de découvrir un tas de code simple en css pour en faire, fonctionnant tous sur le même principe, à savoir afficher une zone de texte caché grace au le survol d'un lien (en jouant avec les attributs "a hover span" et "hidden").

Et c'est là que ce situe mon problème. En effet, dans le site que je développe, de nombreux mots vont avoir besoin d'une définition. Mais certains seront cliquable parce que possédant une page dédié (dont en plus de la définition succinte, on pourra aller sur leurs pages pour en savoir plus) et d'autres n'auront qu'une simple définition.

Le problème, c'est que si les mots qui n'ont qu'une simple définition doivent se transformer en faux liens (genre en pointant vers #) pour avoir leurs infobulles, on perd completement la notion de "simple définition" et "lien vers une autre page". Ca oblige l'utilisateur a cliquer pour savoir s'il peux en savoir plus sur le mot en question ou pas, lui faisant perdre au passage sa position dans la page et, dans la mesure ou les mots sans liens seront les plus nombreux, en lui fesant probablement renoncer assez rapidement à cliquer sur les mots ou il est pertinent de cliquer.

Bref, si quelqu'un a un petit bout de code qui me permetrait d'afficher une infobulle sans être obligé de creer un lien, ca m'interesse !

Merci d'avance !

Tu peux faire deux classes de liens. Une pour les liens qui pointent vers une URL et une autre pour les liens qui ne pointent pas vers une URL.

Dans le deuxième cas, tu t'arranges pour que la couleur du texte soit la même que du texte simple.

Et pour garder la position dans la page si l'utilisateur clqique dessus quand même, il ne faut pas mettre # dans le href mais :

Code:

---

<a href="javascript:;">

---

Exelent l'astuce du "javascript:;" a la place de #, je ne connaissais pas et ca résoud effectivement mon problème !

Merci ;-)

Citation:

---

Envoyé par Rakken

Exelent l'astuce du "javascript:;" a la place de #

---

Cette syntaxe peut réserver quelques surprises, si l'utilisateur clique dessus.


La balise title n'est pas réservée à la balise de liens <a> :

Code:

---

1 2 3 4 5

bla bla <span style="color:#FF5555; font-weight: bold" title="ceci est une information" onmouseover="this.style.cursor='help'"> bla bla </span> bla bla

---

Citation:

---

Envoyé par Auteur

Cette syntaxe peut réserver quelques surprises, si l'utilisateur clique dessus.

---

Seulement parce que tu n'avais pas fermé la chaîne par un point-virgule. :roll:

Citation:

---

Envoyé par Auteur

La balise title n'est pas réservée à la balise de liens <a>

---

Sauf que justement, dans son précédent topic il disait que l'attribut title ne convenait pas, le texte long étant tronqué.