Faire apparaitre un calque au survol d'un lien

Faire apparaitre un calque au survol d'un lien - HTML/CSS - Programmation

Marsh Posté le 24-06-2010 à 08:29:25    

Bonjour,
 
J'aimerais faire en sorte que lorsqu'on survole mes liens texte ou image, il apparaisse soit un commentaire textuel soit une image dans une sorte de calque (pourquoi pas pas tout à fait opaque) qui suive le curseur tant que celui-ci est au-dessus du lien.
 
J'ai déjà vu ça mais impossible de vous retrouver un exemple. :/
 
Bien sûr, il y a "alt" et "title" mais quand c'est géré par le navigateur, dès que la souris bouge, le commentaire disparaît. :(
 
Si possible, je ne veux pas d'un énième JavaScript. Plutôt un truc clean en CSS. ;)
 
Merci. :jap:

Reply

Marsh Posté le 24-06-2010 à 08:29:25   

Reply

Marsh Posté le 24-06-2010 à 09:04:26    

Salut,
C'est beau d'être soucieux d'être clean et de ce passer de JS quand il n'y en a pas besoin... Mais impossible en CSS de faire suivre ton curseur, et l'organisation pour faire apparaitre un élément B au survol d'un element A implique que ce B soit selectionnable en CSS à partir du A:hover, ce qui complique la chose...
Bref, dsl, tu devrais passer par JS...
A toi de faire en sorte que cette infobulle soit facultative (juste un gros +) pour que, malgrés l'utilisation de JS, ce soit "clean"...

 

Tooltips (Jquery) => http://blog.jaysalvat.com/demo/tooltips/ (la source est dans le lien "Retour à l'article ..." )
Super simple à mettre en place (si tu connais un minimum XHTML/CSS/JS), et plutôt léger...


Message édité par abais le 24-06-2010 à 09:05:54

---------------
Le membre ci-contre n'est pas responsable du message ci-dessus.
Reply

Marsh Posté le 24-06-2010 à 17:23:44    

Parfait, c'est exactement ce que je voulais mais je ne connaissais pas le nom, merci beaucoup. :jap:
 
Oui, je vais faire en sorte que ça reste un petit extra et que ça ne pénalise pas les internautes qui ont désactivé JS.
 
 
Merci beaucoup pour l'info et les conseils. :jap:

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed