Bonjour à toutes et à tous,
J'ai un petit soucis avec une page que je suis en train de créer. Elle se présente de la manière suivante
- Une colonne à gauche (en vert) avec un menu
- Une ligne (en gris) ou apparaissent des miniatures de photos
- Une autre partie (en violet "lavande") où apparaissent les photos selon qu'on a cliqué sur une miniature.
Le code de la page est le suivant :
Pour tester, j'ai crée la page 01.php dont voici le code :
Et cette page, la page 11.html supposée contenir la grande image. Voici la code :
Je souhaite donc faire en sorte que, quand l'internaute clique à gauche par exemple sur "Installation du Stand", apparaissent dans la partie grise de droite, les miniatures relatives à la partie "Installation du Stand", puis lorsqu'il clique sur une de ces miniatures, que la photo agrandie apparaisse dans la partie violette en dessous de la partie grise. Sur la page principale , la miniature et la photo apparaissent correctement. En cliquant sur "Installation du Stand" , la miniature apparaît également correctement. Mais, en cliquant sur cette miniature , la miniature disparaît, la grande photo s'affiche à la place, je perds donc le contenu de la partie grise.
Et c'est là mon problème. Je souhaite que les photos agrandies s'affichent, et que les miniatures soient toujours visibles.
Je pédale dans la choucroute sans savoir où je me dirige
Quelqu'un verrait-il le problème qui se pose dans ma page? Je suis à l'écoute de toute aide
En espérant avoir été assez explicite sur le problème en question, n'hésitez pas à me corriger
Merci d'avance pour votre aide!
Fred
Modifié par drf_ (15 Feb 2006 - 08:54)
J'ai un petit soucis avec une page que je suis en train de créer. Elle se présente de la manière suivante
- Une colonne à gauche (en vert) avec un menu
- Une ligne (en gris) ou apparaissent des miniatures de photos
- Une autre partie (en violet "lavande") où apparaissent les photos selon qu'on a cliqué sur une miniature.
Le code de la page est le suivant :
<!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">
<title>Deux zones avec scroll en CSS</title>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
/* CSS issu des tutoriels css.alsacreations.com */
html, body {
height: 100%;
width: 100%;
overflow: auto;
}
body {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size: 0.8em;
margin: 0;
padding: 0;
}
img {
border: none;
margin: 0;
padding: 0;
}
#droite {
height: 100%;
margin-left: 200px;
overflow: auto;
background-color:#FFFF66;
}
#contenuhaut {
height: 50px;
background-color: #999999;
}
#contenubas {
padding: 20px;
overflow: auto;
background-color: #CCCCFF;
}
#menu {
position: absolute;
left:0;
background-color: #99CCCC;
width: 200px;
height: 100%;
}
#head li {
display: inline;
}
p {
text-decoration: none;
vertical-align: middle;
color: #000000;
}
a:link {
text-decoration: none;
color: #000000;
}
a:visited {
text-decoration: none;
color: #000000;
}
</style>
</head>
<body>
<div id="menu">
</div>
<div id="droite">
<?php
if (!isset($_GET['page'])) $page= '01'; else $page= $_GET['page'];
switch($page)
{
case '01':include ('txt/01.php');break;
case '02':include ('txt/02.php');break;
case '03':include ('txt/03.php');break;
case '04':include ('txt/04.php');break;
case '05':include ('txt/05.php');break;
case '11':include ('txt/11.html');break;
}
?>
</div>
</body>
</html>
Pour tester, j'ai crée la page 01.php dont voici le code :
<div id="contenuhaut">
<ul id="head">
<li></li>
</ul>
</div>
<div id="contenubas">
<?php
if (!isset($_GET['page'])) $page= '11'; else $page= $_GET['page'];
switch($page)
{
case '11':include ('txt/11.html');break;
}
?>
</div>
Et cette page, la page 11.html supposée contenir la grande image. Voici la code :
<p><b>Installation du stand</b></p><br/>
<br/>
Je souhaite donc faire en sorte que, quand l'internaute clique à gauche par exemple sur "Installation du Stand", apparaissent dans la partie grise de droite, les miniatures relatives à la partie "Installation du Stand", puis lorsqu'il clique sur une de ces miniatures, que la photo agrandie apparaisse dans la partie violette en dessous de la partie grise. Sur la page principale , la miniature et la photo apparaissent correctement. En cliquant sur "Installation du Stand" , la miniature apparaît également correctement. Mais, en cliquant sur cette miniature , la miniature disparaît, la grande photo s'affiche à la place, je perds donc le contenu de la partie grise.
Et c'est là mon problème. Je souhaite que les photos agrandies s'affichent, et que les miniatures soient toujours visibles.
Je pédale dans la choucroute sans savoir où je me dirige

Quelqu'un verrait-il le problème qui se pose dans ma page? Je suis à l'écoute de toute aide

En espérant avoir été assez explicite sur le problème en question, n'hésitez pas à me corriger

Merci d'avance pour votre aide!
Fred
Modifié par drf_ (15 Feb 2006 - 08:54)