Discussion :

[joviper]

Bonjour, je suis nouveau sur ce forum, je commence à m'intéresser de plus en plus à la création de site web, notamment par l'intermédiaire de l'HTML.
J'ai cependant un pb :

je veux faire une page dans laquelle j'ai inséré des roll-overs se trouvant sur une image de 1024x691. J'ai donc découpée l'image en plusieurs parties en m'aidant de tableaux, et inséré mes roll-overs
Malgré tout, j'ai un gros pb : chaque tableau est pil poil aux dimensions de chaque morceau d'image, je n'ai aucune épaisseur de tableau et pourtant, un espace apparait entre quelques lignes (pas toutes) :

cliquez sur le lien suivant pour voir :
avec tableaux visibles
http://lapoesiedurien.free.fr/temp/index/page2.html
sans tableaux visibles
http://lapoesiedurien.free.fr/temp/index/page2bis.html
Merci de bien vouloir m'aider svp, je m'arrache les cheveux, j'ai tout vérifié, enfin je pense vu que je débute...

[N1bus]

Tu peux essayer de tout mettre dans une seule cellule d'1 tableau avec border= 0 :

Code HTML :

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
<TABLE cellSpacing=0 cellPadding=0 border=0>
    <TR>
      <TD vAlign=top align=left width=1024 colSpan=9 height=206><IMG height=206 
      src="Index_fichiers/img5.jpg" width=1024 border=0><img height=32 
      src="Index_fichiers/img6.jpg" width=553 border=0><a 
      onMouseOver="document.img7.src='img7in.jpg';" 
      onMouseOut="document.img7.src='img7out.jpg';" 
      href="http://lapoesiedurien.free.fr/temp/index/lien.html"><img height=32 
      src="Index_fichiers/img7out.jpg" width=33 border=0 name=img7><img height=32 
      src="Index_fichiers/img8.jpg" width=438 border=0><br><img height=110 
      src="Index_fichiers/img9.jpg" width=1024 border=0><br><img height=47 
      src="Index_fichiers/img10.jpg" width=509 border=0></a><a 
      onMouseOver="document.img11.src='img11in.jpg';" 
      onMouseOut="document.img11.src='img11out.jpg';" 
      href="http://lapoesiedurien.free.fr/temp/index/lien.html"><img height=47 
      src="Index_fichiers/img11out.jpg" width=47 border=0 name=img11><img height=47 
      src="Index_fichiers/img12.jpg" width=468 border=0><br><img height=39 
      src="Index_fichiers/img13.jpg" width=303 border=0></a><a 
      onMouseOver="document.img14.src='img14in.jpg';" 
      onMouseOut="document.img14.src='img14out.jpg';" 
      href="http://lapoesiedurien.free.fr/temp/index/lien.html"><img height=39 
      src="Index_fichiers/img14out.jpg" width=38 border=0 name=img14><img height=39 
      src="Index_fichiers/img15.jpg" width=683 border=0><br><img height=54 
      src="Index_fichiers/img16.jpg" width=1024 border=0><br><img height=22 
      src="Index_fichiers/img17.jpg" width=625 border=0></a><a 
      onMouseOver="document.img18.src='img18in.jpg';" 
      onMouseOut="document.img18.src='img18out.jpg';" 
      href="http://lapoesiedurien.free.fr/temp/index/lien.html"><img height=22 
      src="Index_fichiers/img18out.jpg" width=25 border=0 name=img18><img height=22 
      src="Index_fichiers/img19.jpg" width=374 border=0><br><img height=181 
      src="Index_fichiers/img20.jpg" width=1024 border=0></a></TD>
    </TR>
</TABLE>

[joviper]

c'est pas mal du tout et ça allège énormément le code dis donc !
c cool, merci, par contre, le bémole, c'est les roll-over qui marchent sur toutes la largeur au lieu de la zone du bouton...ya moyen ou pas de pouvoir réduire les zones..le code que tu ma refaits est justement plus léger au niveau des rollovers, c'est ptètre pour ça ?

[N1bus]

je n'ai pas tenu compte des rollovers , j'ai juste copié/collé puis nettoyé.

A mon avis tu devrais tous les enlever et tous les refaire.

Si tu ne veux pas que le rollover agisse sur l'image entière, utilise les map :

C'est une zone délimitée de ton image sur laquelle agira le rollover .

Je ne sais pas trop comment te l'expliquer . J'utilise DreamWeaver qui fait ça tout seul (presque)...

[joviper]

en tous cas merci beaucoup, tinkiète pour lexplication, je viens de comprendre il y a 15min..j'ai réussi simplement en encadrant l'image concernée par le roll-over, c-a-d mes bouton et ça marche. C'est efficace ton nettoyage.

[Oluha]

si tu n'as plus de problème, pense à cliquer sur le bouton résolu