Affichage d'un thumbnail en survolant un lien
Affichage d'un thumbnail en survolant un lien - HTML/CSS - Programmation
Marsh Posté le 19-02-2005 à 20:09:46
pas de javascript, juste du CSS ... tu mets le menu en texte et tu fais bien un hover pour afficher la thumbnail en rollover ...
explication ici : http://www.alsacreations.com/articles/rollover_unique/
ça devrait etre ce que tu cherches 
Il ne te reste qu'à faire une image moitié vide moitié pleine [ transparente sur 50% de la largeur et la vignette sur l'autre moitié) et à faire une image gif transparente en image de rollover off ... et l'image apparaitra juste à coté de ton lien lors de son survol ...
bonne soirée
Message édité par Profil supprimé le 19-02-2005 à 20:11:43
Marsh Posté le 20-02-2005 à 17:20:37
Merci pour ta réponse !
Par contre moi j'aimerais éviter d'avoir à réserver un emplacement pour l'image (invisible).
J'aimerais que l'image s'affiche sur tout le reste des éléments (texte, lien, ...)
Bon pour faire plus simple voilà ce que j'aimerais : 
Marsh Posté le 20-02-2005 à 18:04:22
Pour faire un truc pareil, il faut du beau javascript bien kaka 
Pour faire quelque chose de propre, on préférera un truc dans ce style
---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
Marsh Posté le 20-02-2005 à 18:04:57
Bon j'ai trouvé quelque chose qui me convient, je ne pense pas que ça soit mieux que l'idée proposée par gunner4902 mais celle-ci, j'ai réussi à la faire fonctionner 
Voici le code :
Code :
|
Marsh Posté le 20-02-2005 à 18:07:21
Masklinn -> ha bah ça ressemble fortement à la proposition de gunner4902.
Bon je vais quand même reéssayer avec votre méthode parce c'est que javascript ça va bien 5 min
Marsh Posté le 20-02-2005 à 18:29:55
| ofbdood a écrit : Masklinn -> ha bah ça ressemble fortement à la proposition de gunner4902. |
C'en est issu, mais de manière beaucoup plus complexe dans la mesure où c'est un rollover à distance en CSS (passer la souris sur un élément affecte non l'élément mais un élément distant, en tout cas on en a l'illusion)
Voir les CSS Popups d'Eric Meyer pour savoir comment c'est fait
et ici un exemple de gallerie d'images rollover (code plus simple que le lien de gallerie précédent)[/url]
---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
Marsh Posté le 20-02-2005 à 18:57:17
Ha parfait ça marche 
Par contre je l'ai simplifié au maximum pour moi.
Le .css
Code :
|
Le .html
Code :
|
Marsh Posté le 20-02-2005 à 19:26:59
ce fut un plaisir de pouvoir t'aider !
bonne continuation
Sujets relatifs:
- comment faire un double lien en PHP ? [reglé]
- faire un lien avec l/p sur un site web
- Lien dans une page HTML vers un bookmark dans un fichier .DOC
- [HTML] Afficher un post-it au passage sur un lien ???
- Lien en fondu
- rafraichir affichage
- Affichage de page
- FLASH (lien vers une autre page)
- Modifier un lien dans un script Java
- Comment supprimer ligne entre 2 titres // ce lien ne se centre pas ?
Marsh Posté le 19-02-2005 à 19:22:56
Bonsoir à tous,
Voilà beaucoup doivent se dire : "quel boulay ça à été abordé 36 000 fois sur le forum" et bien en fait ça ne me convient jamais
J'explique ce que je veux faire :
J'ai une liste de liens qui s'affichent sur ma page, du genre :
image01
image02
image03
Ce que je veux obtenir c'est que lorsque l'on survole un lien, il s'affiche l'image correspondante, mais attention pas dans une nouvelle fenêtre, je la veux "liée" au curseur. Dès qu'on enlève la souris du lien l'image disparaît.
J'espère que je me suis fait comprendre.
J'ai déjà pas mal regardé à mon avis il va obligatoirement falloir du javascript et pas uniquement du css.
je pensais le faire en utilisant "hover" mais après pour le reste j'ai un peu de mal.
Quelqu'un aurait il une idée ? (où même un lien ça me suffit)
Message édité par ofbdood le 19-02-2005 à 19:23:49