[Javascript] Diaporama d'images

Fermé

small-princess16 - 21 sept. 2009 à 15:03
serge - 27 oct. 2009 à 16:25

Bonjour,

J'ai piqué sur internet un script pour faire un diaporama d'images avec fondu et qui tourne en boucle. Source: https://www.creationdesiteinternet.fr

J'ai un tableau avec trois colonnes, et dans ces 3 colonnes j'aimerais que ce script tourne.
Malheureusement, il tourne bien, mais dans chaque colonne chacun leur tour. C'est à dire que les images tourne en boucle dans la colonne 1 du tableau et une fois que toutes les images sont passées, il repasse toutes les images mais dans la colonne 2, ainsi de suite...

Je ne m'y connais pas assez en javacript pour modifier moi-même le script!
Pourriez-vous m'aider?
Dites moi si vous avez besoin de plus d'infos!

Merci

A voir également:

[Javascript] Diaporama d'images
Telecharger javascript - Télécharger - Langages
Faire un diaporama photo avec musique windows 10 - Guide
Des images - Guide
Dans le diaporama à télécharger, les diapositives s’enchaînent automatiquement. combien de temps la diapositive crayon met-elle à s’afficher ? combien de temps reste-t-elle affichée à l’écran ? ✓ - Forum Powerpoint
Dans le diaporama à télécharger, les diapositives s'enchaînent automatiquement. que peut-on dire de la diapositive crayon ? - Forum Powerpoint

3 réponses

Réponse 1 / 3

small-princess16
21 sept. 2009 à 16:29

HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>MAHF</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script src="scripts/prototype.js" type="text/javascript"> </script>
<script src="scripts/scriptaculous.js?load=effects" type="text/javascript"></script>

<link href="mahf_css.css" rel="stylesheet" type="text/css">
<script>
var effect = 1;
var time = 3000;

var current_image = 0;
var next_image = 1;
var image = new Array();

function init() {
if(document.getElementsByClassName("image")) {
image = document.getElementsByClassName("image");
for(i=1; i < image.length; i++) {
image[i].style.display = "none";
}
}

if(image.length > 1) galerie();
}

function galerie() {
self.setTimeout("nextimage()",time);
}
function nextimage() {
if(effect == 1) { new Effect.Fade(image[current_image]); new Effect.Appear(image[next_image]); }
if(effect == 2) { new Effect.BlindUp(image[current_image]); new Effect.BlindDown(image[next_image]); }

if(next_image == (image.length-1)) {
current_image = next_image;
next_image = 0;
} else {
current_image = next_image;
next_image++;
}
galerie();
}

</script>

</head>

<body>
<div id="container">
<div id="content">

<div id="header">
<div id="logo"> <img src="logo.gif"> </div>
<div id="museeF"> MUSEE <br>
D'ART ET D'HISTOIRE<br> FRIBOURG <br> <span id="museeD">MUSEUM <BR> FUR KUNST UND GESCHICHTE <BR> FRIBOURG</span> </div>
<div id="menu">
<ul>
<li class="navig"> Home </li>
<li class="navig"> Search </li>
<li class="navig"> Contact </li>
<li class="navig"> News </li>
<li class="navig"> Français </li>
<li class="navig"> Deutsch </li>

</ul>
</div>
</div>

<div id="tableau">
<table cellspacing="0" cellpadding="0">
<tr>
<td id="col1" valign="top">Musée d'art et d'histoire <br> Fribourg</td>
<td id="col2" valign="top">Espace Jean Tinguely <br> Niki de Saint Phalle</td>
<td id="col3"></td>
</tr>
<tr>
<td id="col1_2">
<div class="diaporama"> <img src="test1.jpg" class="image" alt="" /> <img src="test2.jpg" class="image" alt="" />
</div>

</td>
<td id="col2_2"><div class="diaporama">
<img src="test1.jpg" class="image" alt="" />
<img src="test2.jpg" class="image" alt="" /> </div></td>

<td id="col3_2" ><div class="diaporama"> <img src="test1.jpg" class="image" alt="" />
<img src="test2.jpg" class="image" alt="" /> </div></td>

</tr>


</table>
<div id="footer">
<div id="heures">Heures d'ouvertures - Coordonnées - Accès </div>
<div id="web"> > www.fr.ch </div>
</div>
</div>
</div>

</div>
<script type="text/javascript">
init();
</script>
</body>
</html>

CSS: (utilisé uniquement pour les images du diapo)

.diaporama img {
margin: -205px 0 0 0;
position:absolute;
width: 254px
}

ET les scripts qui sont lié à ma page HTML sont des scripts déjà fait, à télécharger ici:

http://script.aculo.us/downloads

(sous Current Version ->scriptaculous-js-1.8.2.zip)

Merci :)

Réponse 2 / 3

eba973 Messages postés 32 Date d'inscription mercredi 12 août 2009 Statut Membre Dernière intervention 22 septembre 2009 9
21 sept. 2009 à 15:43

Bonjour,
Peux-tu montrer ton html et ton script ?

A+
Eric

http://www.ameliorer-votre-site.com?s=f1

Réponse 3 / 3

small-princess16
22 sept. 2009 à 08:34

Pas de solution.. ? :-(

serge
27 oct. 2009 à 16:25

Bonjour, je remarque que dans les 3 colonnes de tu inscris les mêmes images. Fais un essais en ajoutant les images test3 test4 test5 test6 dans to diaporama et en inscrivant dans la colonne 2 test3.jpg et test4.jpg etr dans la colonne 3 les deux autres.
si le diaporama fonctionne correctement actuellement le fait d'ajouter des images te permettant de modifier le nom des images dans le script devrait résoudre ta question.
Serge

Discussions similaires

calcule nombre des pixels "noir" dans un image (noir/blanc)

Javascript Arrondi à 2 chiffres après la virgule

voir ses images enregistrés

ou sont enregistrées les images

Une musique qui évoque le souvenir ?