Obtenir un scroll sur une galerie d'images

**petitours** · 13/08/2009, 18h10

Bonjour

je tente de faire exactement la même chose qu'ici : http://www.developpez.net/forums/d69...rizontal-html/mais je n'arrive à rien avec mon div ; Je me retrouve toujours avec un paquet d'image super large qui rend ma page trés large et le scroll se fait sur la page, pas sur les images...

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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
  <title>##############test</title>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</head>
<body bgcolor="#000000" onload="Affich()" >
 
<table width="50%" style="border:solid 2px red; " align="center">
<tr height="200" valign="middle" align="center">
	<td>
	<img src='mesimages/1.jpg' alt='"mesimages/1.jpg"' height="300" />
	</td>
</tr>
<tr>
<td>
 
	<div  style="width:100%; overflow:auto ;"> 
	<table border="1" style="border:solid 2px green; style="width:100%;overflow:hidden;"> 
	<tr> 
	<td><img src='mesimages/1.jpg' alt='' height="190" title="1C"/></td>
	<td><img src='mesimages/2.jpg' alt='' height="190" title="2C"/></td>
	<td><img src='mesimages/3.jpg' alt='' height="190" title="3C"/></td>
	<td><img src='mesimages/4.jpg' alt='' height="190" title="4C"/></td>
	<td><img src='mesimages/5.jpg' alt='' height="190" title="5C"/></td>
	<td><img src='mesimages/6.jpg' alt='' height="190" title="6C"/></td>
	</tr> 
	</table> 
	<div> 
 
</td>
 
</tr>
</table>
</body>
</html>

Ce code est sensé faire un tableau de 2 lignes qui prend 50% de la largeur de la page.
La première ligne contient une grande photo.
La seconde ligne contient une série de photos cote à cote qui doivent pouvoir etre "scrollées" dans le tableau qui ne fait que 50% de la largeur de l'écran.

bref, ca doit ressembler à ceci
http://lescourroies.free.fr/pages/photos03.html

Merci par avance de me débloquer

**12monkeys** · 15/08/2009, 13h47

Bonjour

Dans ton code tu as une erreur : tu indiques une balise style dans une autre balise style.

Code :

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

<table border="1" style="border:solid 2px green; style="width:100%;overflow:hidden;">

**petitours** · 15/08/2009, 22h12

Bonjour

Merci pour cette erreur mais malheureusement cela ne change rien à l'affichage obtenu

maintenant j'ai ceci pour le dernier <TR> concerné (le reste du code n'a pas changé)

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
<tr >
	<td colspan=3>
	<div width="100%" style="overflow:auto;"> 
	<table border="2" > 
	<tr >
	<SCRIPT>
	for(a=1;a<(nom.length+1);a++) {
		document.write('<td><A HREF="javascript:ChangeImage('+a+')"><img src="'+dossier+nom[a]+'.jpg" alt="" height="190" title="'+desc[a]+'"/></a></td>');
	}
	</SCRIPT>
	</tr>
	</table> 
	<div> 
	</td>
</tr>

Il y a l'erreur d'écriture que vous décrivez en moins et la création dynamique des images à partir d'un tableau.

Ma page est toujours fonctionnelle mai j'a itoujours la largeu de la page qui prend la largeur de toutes les images réunies...

J'ai essayé de déplacer le div, de recharger les images avec autant de div...je sèche.

Merci

**12monkeys** · 15/08/2009, 23h05

Ce que tu veux c'est le scroll sur la seconde ligne du tableau, et d'après ce que j'ai compris, ce que tu as c'est le scroll sur toute la page ?

Mais quand j'accède à ton site, tout fonctionne...

Tu utilises quelle navigateur pour tester ? Avec Firefox 3 et IE 7 et 8 tout fonctionne a priori ou alors j'ai pas tout compris...

**petitours** · 16/08/2009, 10h31

Bonjour

Envoyé par 12monkeys

Mais quand j'accède à ton site, tout fonctionne...

A quel site ? www.68hc08.net ?
Car ce n'est pas à celui la que je fais référence ; C'est une autre page html, (ci dessous un zip avec la démo complète.
Je la teste avec IE8.0 et firefox 3.0.13.

J'ai effectivement la table qui prend la largeur de toutes les images et le scroll qui se fait donc sur la page entière devenue bien plus large que l'écran.
Je souhaite que la table fasse que 500pix avec un scroll sur la ligne ou il y a les images.

Merci

**12monkeys** · 16/08/2009, 13h37

Pour le site je croyais que tu parlais de lescourroies.free.fr/

Dans ton code change juste les deux premières lignes ainsi :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
	<td colspan="3" style="width:500%;">
	<div style="width:500px;overflow:auto;white-space:nowrap;"> 
	<table border="2" > 
	<tr>
	<SCRIPT>
	for(a=1;a<(nom.length+1);a++) {
		document.write('<td><A HREF="javascript:ChangeImage('+a+')"><img src="'+dossier+nom[a]+'.jpg" alt="" height="190" title="'+desc[a]+'"/></a></td>');
	}
	</SCRIPT>
	</tr>
	</table> 
	<div> 
	</td>