[HTML] rollover

Version imprimable

[HTML] rollover

Bonjour!!!

J'affiche une image; Je voudrai ensuite que lorsque je passe sur cette image ma souris , une autre image s'affiche ou alors que cette mm image devienne grisée.
Mais avec le code suivant, lorsque je passe ma souris sur l'image, l'image disparait et rien n'apparait à sa place.
Ou se trouve mon erreur?

Merci
Code:

1 2 3 4 5 6 <a href="mon_cv.php" onMouseOver="document.ex1.src='C:\Documents and Settings\yven solenn\Mes documents\Mes images\Nouveau dossier\Nouveau dossier\IMG_1636.jpg'" onMouseOut="document.ex1.src='C:\Documents and Settings\yven solenn\Mes documents\Mes images\Nouveau dossier\Nouveau dossier\IMG_1637.jpg'"> <img src="C:\Documents and Settings\yven solenn\Mes documents\Mes images\Nouveau dossier\Nouveau dossier\IMG_1637.jpg" WIDTH=76 HEIGHT=102 border="0" name="ex1" /> </a>

17/09/2005, 21h11
xmarabout

ou est l'erreur ?

Essaye un peu en ajoutant un petit "javascript:" devant tes commandes document.ex1.src...
17/09/2005, 21h17
sole

ça ne fonctionne toujours pas

:google2:

Sinon, une autre méthode sans Javascript, en CSS : Il faut utiliser le background-image dans un conteneur (div, span, etc...).
Exemple :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 <html> <head> <style type="text/css">  </style> </head> <body> <a href="#"><div class="roll"><img src="out1.jpg" alt="" style="visibility:hidden;"/><div/></a> </body> </html>
http://sub0.developpez.com/tag.png
Lien tout en bas à gauche de cette fenêtre

17/09/2005, 23h46
sole

j'ai réutilisé ton exemple mais pour la partie body je n'arrive pas a redimensionner mon image , je la voudrai en plus petit et en entier mais je n'arrive a avoir qu'une seule partie de l'image!!

Code:

<a href="mon_cv.php"><div class="roll"><img src="C:\Documents and Settings\yven solenn\Mes documents\Mes images\Nouveau dossier\Nouveau dossier\IMG_1636.jpg" WIDTH=76 HEIGHT=102 alt="" style="visibility:hidden" /><div/></a>
18/09/2005, 06h22
Sub0

On ne peut pas redimensionner une image en background.
Il faut utiliser les propriétés width et height de l'image :

http://cerig.efpg.inpg.fr/dossier/fe...yle/page12.htm

Je n'arrive toujours pas a dimensionner mes images!! je n'arrive a avoir qu'une parti de l'image

Code:

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
  <style type="text/css">
  <!--
 
  a .roll {
    background:url('C:\Documents and Settings\yven solenn\Mes documents\Mes images\Nouveau dossier\Nouveau dossier\IMG_1637.jpg');
   background-repeat: no-repeat;
 
  }
 
  a:hover .roll {
    background:url('C:\Documents and Settings\yven solenn\Mes documents\Mes images\Nouveau dossier\Nouveau dossier\IMG_1637bis.jpg');
    background-repeat: no-repeat;
 
  }
  
    a .roll1 {
    background:url('C:\Documents and Settings\yven solenn\Mes documents\Mes images\Photo\vacances_2004\Vacances pays basque\Pays basque_2.JPG');
   background-repeat: no-repeat;
 
  }
 
  a:hover .roll1 {
    background:url('C:\Documents and Settings\yven solenn\Mes documents\Mes images\Photo\vacances_2004\Vacances pays basque\Pays basque_2bis.JPG');
    background-repeat: no-repeat;
 
  }
  -->
  </style>

et dans le body:

Code:

1
2
 
<a href="mon_cv.php"><div class="roll"><img src="C:\Documents and Settings\yven solenn\Mes documents\Mes images\Nouveau dossier\Nouveau dossier\IMG_1637.jpg" WIDTH="76" HEIGHT="102" style="visibility:hidden;"/><div/></a>

[/code]

18/09/2005, 18h07
Sub0

Citation:

Envoyé par Sub0

On ne peut pas redimensionner une image en background.
Il faut utiliser les propriétés width et height de l'image :

http://cerig.efpg.inpg.fr/dossier/fe...yle/page12.htm

Je pensais être pourtant assez clair; Impossible de redimensionner une image en background.
Tu devras utiliser une autre méthode (voir le lien que j'ai donné), à+