Bonjour à tous,
J'espère que quelqu'un pourra aider une néophite qui essaie de créer un diaporama mais qui n'y connait pas grand chose!
Voila, je voudrais créer un diaporama dont les photos défileraient toutes seules et également avec la possibilité via bouton d'avancer ou reculer.
Le diaporama de base est créé (les images qui défilent) mais les images n'apparaissent pas.
Donc mon problème :
- pourquoi les images n'apparaissent pas
- comment créer des boutons pour faire avancer ou reculer les images.
J'avais trouver via un site les codes pour le diaporama que j'ai recopier tels quels, mais il y a certainement quelqu'un que je n'ai pas dû faire comme il faut.
C'est vraiment important pour moi.
Est ce que quelqu'un peut m'aider....
Voici le code de la page :
<head>
<!--
Set up the caption font in the following style.
Place the style script in the head of the page.
//-->
<style>
.Caption {
font-family: Arial;
font-weight: bold;
color: #123456;
}
</style>
<!--
Place the following script in the head of the page.
Follow the set-up instructions within the script.
//-->
<script>
// (C) 2002 www.CodeLifter.com
// http://www.codelifter.com
// Free for all users, but leave in this header.
var SlideShowSpeed = 3000;
var CrossFadeDuration = 3;
var Picture = new Array(); // don't change this
var Caption = new Array(); // don't change this
Picture[1] = 'façade.jpg';
Picture[2] = 'sépia.jpg';
Picture[3] = 'salle.jpg';
// starting at the end of the Caption array.
// Caution: The number of Captions *must*
// equal the number of Pictures!
Caption[1] = "Le Mystical Restaurant";
Caption[2] = "57 rue des Epéronniers - 1000 Bruxelles";
Caption[3] = "Intérieur - première salle";
// =====================================
// Do not edit anything below this line!
// =====================================
var tss;
var iss;
var jss = 1;
var pss = Picture.length-1;
var preLoad = new Array();
for (iss = 1; iss < pss+1; iss++){
preLoad[iss] = new Image();
preLoad[iss].src = Picture[iss];}
function runSlideShow(){
if (document.all){
document.images.PictureBox.style.filter="blendTrans(duration=2)";
document.images.PictureBox.style.filter="blendTrans(duration=CrossFadeDuration)";
document.images.PictureBox.filters.blendTrans.Apply();}
document.images.PictureBox.src = preLoad[jss].src;
if (document.getElementById) document.getElementById("CaptionBox").innerHTML= Caption[jss];
if (document.all) document.images.PictureBox.filters.blendTrans.Play();
jss = jss + 1;
if (jss > (pss)) jss=1;
tss = setTimeout('runSlideShow()', SlideShowSpeed);
}
</script>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_reloadPage(init) { //reloads the window if Nav4 resized
if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);
//-->
</script>
<title>Mystical Restaurant - Galerie de Photos et Presse</title></head>
<!--
Add the onload=runSlideShow() event call to the body tag.
//-->
<body bgcolor=#292476 text="#B1B1B1" link="#B1B1B1" vlink="#B1B1B1" alink="#B1B1B1" onload=runSlideShow()>
<!--
The following table holds the images and captions.
Place the table in your page where you want the slideshow
to appear. Follow the instructions for each table cell.
//-->
<div id="Layer1" style="position:absolute; left:404px; top:135px; width:241px; height:200px; z-index:1">
<table border=0 align="center" cellpadding=0 cellspacing=0>
<tr>
<!--
The next table cell holds the images.
Set cell and image width and height the same.
The img src must have name=PictureBox in its
tag. Usually the first image in the Picture
array in the script is used here.
//-->
<td width=350 height=182> <img src=façade.jpg name=PictureBox width=320 height=240></td>
</tr>
<tr>
<!--
The next table cell holds the captions.
This table cell must have id=CaptionBox and
class=Caption in its tag. The default caption
shows whilst loading in all browsers; NS4
will show only the default caption, throughout.
//-->
<td id=CaptionBox class=Caption align=center bgcolor=#fedcba> This is the
default caption. </td>
</tr>
</table>
</div>
<div id="Layer3" style="position:absolute; left:202px; top:165px; width:83px; height:26px; z-index:3">
<div align="left"><a href="Entrée.htm" title="ACCUEIL"><strong>ACCUEIL</strong></a></div>
</div>
<div id="Layer4" style="position:absolute; left:202px; top:211px; width:138px; height:24px; z-index:4">
<div align="left"><strong><a href="le restaurant.htm" title="LE RESTAURANT">LE
RESTAURANT</a></strong></div>
</div>
<div id="Layer5" style="position:absolute; left:202px; top:254px; width:131px; height:25px; z-index:5">
<div align="left"><strong><a href="La carte.htm" title="LA CARTE">LA CARTE</a></strong></div>
</div>
<div id="Layer6" style="position:absolute; left:202px; top:296px; width:131px; height:27px; z-index:6">
<div align="left"><strong><a href="Plan d'accès.htm" title="PLAN D'ACCES">PLAN
D'ACCES</a></strong></div>
</div>
<div id="Layer7" style="position:absolute; left:202px; top:339px; width:126px; height:24px; z-index:7">
<div align="left"><strong><a href="contact.htm" title="CONTACT">CONTACT</a></strong></div>
</div>
<div align="center">
<div id="Layer2" style="position:absolute; left:203px; top:410px; width:610px; height:124px; z-index:2">
<div align="justify"> <font color="#B1B1B1" size="2"><strong>(c) Bruxelles
Ni Vu Ni Connu 2002</strong></font> :
<p><font color="#B1B1B1" size="2">Non loin de la Galerie Agora et de la
rue de Lombard, cette maison de briques du XVIIe siècle illuminée
de bougies comble un léger vide en restos-romantiques dans ce quartier
voué à la restauration touristique (on est à deux
stations de la rue des pittas). Ici, les soirées intimes, yeux
dans les yeux (allez voir la salle annexe, de 12 places, au plafond éclairé
de milliers de petites ampoules) trouvent leur mise en scène idéale
(et peuvent s'achever par une balade sur les pavés de la Grand-Place).En
cuisine, deux chefs se complètent, Didier Adouan et Patricj Houben,
pour nous proposer de belles assiettes classiques et savoureuses. Détail
amusant, la carte est classée en "petite communion" (les
entrées), et "grande communion" (les plats), ce qui donnerait
envie à chacun de se faire confirmer plus souvent!</font></p>
</div>
</div>
<img src="mystical%203.jpg" width="700" height="600"></div>
</body>
</html>