Diaporama en html

J'ai beau creusé le CSS et le code HTML avec ma povr' tête, même avec les explications données, mais là.... je bogue définitivement.

Ma souris se change bien en main au passage des vignettes mais ni les vignettes, ni les images ne s'affichent, l'écran reste désespérément noir.

Please donnez nous une indication supplémentaire... à défaut de LA solution.
Je n'en peux plus de chercher.

@0livier34Bonjour Olivier34

Voila ce que j'ai mis dans ma page empire. html
avant /head : <link rel="stylesheet" type="text/css" href="russe/russe.css">

Dans mon tableau
<!-- Galerie images -->
<tr>
<td style="vertical-align: top;">
<img src="images/ligne.gif" border="0" height="8" width="174" alt="Illustrated History of the Russian Empire">
<br><span style="font-weight: bold; color: rgb(204, 0, 0);">Pictures</span>
<br>
</td>
<td style="vertical-align: top; background-color: rgb(152,252,152); text-align: justify;">
<img src="images/ligne.gif" border="0" height="8" width="506" alt="Illustrated History of the Russian Empire">
<br>
<div id="gallery">
<em id="thumbs">
<a href="#nogo">
<img src="russe/empire_russe01.jpg" title="" alt="Illustrated History of the Russian Empire" /></a>
<br><a href="#nogo">
<img src="russe/empire_russe02.jpg" title="" alt="Illustrated History of the Russian Empire" /></a>
<br><a href="#nogo">
<img src="russe/empire_russe03.jpg" title="" alt="Illustrated History of the Russian Empire" /></a>
<br><a href="#nogo">
<img src="russe/empire_russe04.jpg" title="" alt="Illustrated History of the Russian Empire" /></a>
<br><a href="#nogo">
<img src="russe/empire_russe05.jpg" title="" alt="Illustrated History of the Russian Empire" /></a>
<br><a href="#nogo">
<img src="russe/empire_russe06.jpg" title="" alt="Illustrated History of the Russian Empire" /></a>
</em>
</div>
</td>
</tr>

le code CSS (russe/russe.css)
body {
background-color: #000000
}
#gallery {
position: relative;
width: 50px;
}
#thumbs {
width: 50px;
float: left;
}
#thumbs a {
display: block;
float: right;
margin: 0 0 5px 5px;
width: 50px;
height: 65px;
border: 0px solid #000;
}
#thumbs a img {
width: 50px;
height: 65px;
border: 0;
}
#thumbs a:hover {
border-color: #ddd;
}
#thumbs a:hover img {
position: absolute;
width: auto;
height: auto;
left: 60px;
top: 10px;
border: 1px solid #333;
}

Bonne chance

Merci pour le message en réponse. Peux-tu m'indiquer où est l'erreur dans l'adaptation de ton exemple que je voudrais reproduire (voir mon message précédent) ?

Salut

il faudrait peut etre mieux de voir avec celui la ?

les fichiers

a+

Salut Rad Zone.
Merci pour l'autre diapo. Je préfère vraiment le premier en fait, on ne peut vraiment pas ajouter un texte de présentation sur la photo survolée dans ton premier diapo?
Merci d'avance?

Salut

le voila mais il y a pas mal de modifs ! regarde bien !,

les petites images sont passe en liste !

il faut aussi adapter la css au dimensions de tes images pour les grandes !

https://www.datafilehost.com/d/ce9ab58c

mais c est ce que tu voulais ;-))

A+

Salut Rad zone et un grand merci pour le temps et les explications! c'est vraiment sympa de ta part!

Bonsoir Pleuven,
non seulement le code js doit être mal adapté mais en plus je ne sais pas où le placer dans ma page html. Du coup il s'ouvre dans une autre page.
J'aimais bien les effet de transparence et de fondu qui lui donnait un coté plus classe, mais je pense que je vais abandonner.

Je voudrais que mes vignettes s'agrandissent sur la même pages.
Il faut que je fasse le menage sur mes pages et je pourrais te les envoyer ?
par contre je ne sais pas comment te donner mon adresse mail sans le faire apparaitre sur le forum.

merci

Bonsoir pleuven64,
j'aurais besoin d' aide mais je ne peux pas t'envoyer de message privé.

Help