image qui s'affiche au dessus avec souris au passage sur un lien

**pierrot10** · 14/09/2006, 13h35

Bonjour,
je cherche une solution simple qui fait ceci

Quand je passe ,a souris sur un lien, j'aimerai que l'icone d'un cadena s'affiche au dessu/en plus de la main standard.

Il faudrait que ca marche avec IE, Netscape, Safari et Firefox.

J'ai pensé récupérer la position du curseur puis dé-cacher l'image, mais suis pas expert en javascript et j'aurais voulu votre aide,

merci!

**Bisûnûrs** · 14/09/2006, 13h58

Une solution consiste à modifier l'image du curseur, si c'est ce que tu souhaites, mais évidemment, seulement compatible avec IE ...

**stanford** · 14/09/2006, 14h36

La propriété de feuille de style css cursor accepte pour Internet Explorer 6+ et Firefox un curseur personnalisé au format ".cur" ou ".csr".
donc ton lien ressemblerais a :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<a href="#" style="cursor:url(moncueseur.cur) "

mais désolé safari et netscape non...

tu pourrais aussi rajouter une image de cadena dans un div qui se positione juste a coté de ton lien quand tu passe au dessus du lien, c'est peut etre la solution la plus simple plutôt que de modifier le curseur.

**Auteur** · 14/09/2006, 17h43

bonjour,

Tu as posté le même sujet dans le forum HTML

:
http://www.developpez.net/forums/sho...d.php?t=210219
et il y a des réponses.

**stanford** · 15/09/2006, 09h38

ha ben comme quoi chuis pas une grande star en css, mais ma solution était bonne et crossbrowser en plus

**Bisûnûrs** · 15/09/2006, 09h45

Envoyé par stanford

ha ben comme quoi chuis pas une grande star en css, mais ma solution était bonne et crossbrowser en plus

Sauf que les curseurs personnalisés ne fonctionnent qu'avec IE. ^^
Après tu peux évidemment prendre les curseurs standards mais ce n'est pas ce qu'il veut.

**pierrot10** · 18/09/2006, 16h51

Merci Stanfor,
mais aucune des deux solution fonctionne avec IE et firefox.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

a.resources_links:hover{ color: #cc6600;text-decoration:underline; cursor:url(img/icone/secure.csr);}

Cependent la deuxiemen solution me parait bien d'essayé. Mais comment puis, je possitionner un div en focnton de la souris?

**Bisûnûrs** · 18/09/2006, 17h01

http://javascript.developpez.com/faq...nt#SourisCoord

Après à toi d'adpater le code ..

**Auteur** · 18/09/2006, 22h55

j'ai retrouvé dans mes archives cet excellent code.

Par contre je ne sais plus de qui est ce code, si l'auteur se reconnait qu'il se manifeste

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
 
<html>
<head>
<title></title>
<style>
<!--
/* INFOS BULLES */
a.info_image {
  text-decoration: none;
  position: relative;
  /*z-index: 0;*/
}
 
a.info_image span {
  display: none;
}
 
a.info_image:hover {
  text-decoration: none;
  background: none; /* HACK IE */
  /*z-index: 1;*/
}
 
a.info_image:hover span {
  display: block;
  position: absolute;
  top: 10px;
  left: 40px;
  border: none;
}
img{
border: none;
}
//-->
</style>
</head>
 
<body>
bla bla bla bla bla bla bla bla bla bla bla bla
 
<b><a href="#" class="info_image">ton lien
<span><img src="ImagePopUp.gif" alt="" /></span>
</a></b>
 
bla bla bla bla bla bla bla bla bla bla bla bla 
bla bla bla bla bla bla bla bla bla bla bla bla
bla bla bla bla bla bla bla bla bla bla bla bla
bla bla bla bla bla bla bla bla bla bla bla bla
bla bla bla bla bla bla bla bla bla bla bla bla
bla bla bla bla bla bla bla bla bla bla bla bla
 
 
</body>
 
</html>

image qui s'affiche au dessus avec souris au passage sur un lien

JavaScript

Discussions similaires

Partager

Partager