Bonjour,

Une idée d'où vient le soucis ?

Cordialement.

Bonjour,

Je bug sérieusement :shock:

même en intégrant les codes js et css dans la page ça ne réagit pas, c'est comme si je n'avait qu'une partie du css ou des js.

Quand je les enlève un a un ça ce modifie c'est donc la preuve que ça marche d'une certaine façon.

Je ne sais franchement plus ou chercher si vous avez une idée.

Bonjour,

Merci je sais mais c'est pour éviter de mettre trop de code d'où le ".." et ".../...".

Donc si mon code est bon ça sous entend qu'il s'entend mal avec un de mes fichiers js :x

Bon je vais regarder ça alors..

.../..
<link rel="stylesheet" ..
<script type="text/javascript" ..
<script type="text/javascript" ..
.../..

<link rel="stylesheet" href="css/image-slideshow-vertical.css">
	<script type="text/javascript" src="js/external/mootools.js"></script>
	<script type="text/javascript" src="js/image-slideshow-vertical.js">

Ton code semble juste mais pourquoi mettre
[html].../..
<link rel="stylesheet" ..
<script type="text/javascript" ..
<script type="text/javascript" ..
.../..[/html] ?

D'après ce que je vois il faudrait mettre

[html]<link rel="stylesheet" href="css/image-slideshow-vertical.css">
<script type="text/javascript" src="js/external/mootools.js"></script>
<script type="text/javascript" src="js/image-slideshow-vertical.js">[/html]

Et ne pas oublier les bonnes redirections !

Bonjour,

Est-ce que je n'ai pas fait une erreur dans mon code :

[code].../..
<link rel="stylesheet" ..
<script type="text/javascript" ..
<script type="text/javascript" ..
.../..
<?php
if (MAX_IMG_NUM>0){?>
<div id="pictures">
<?php
$i = 0; //On instaure notre variable
foreach($itemImages as $img){
if ($i == 0) { //Si $i = 0, alors on est sur la première image
//Afficher l'image en grand
echo '
<div class="dhtmlgoodies_slideshow">
<div class="previewPane">
<img src="image en grand 1" >
<span class="waitMessage"><img src="images/wait.gif"></span>
<div class="largeImageCaption"></div>
</div>
<div class="galleryContainer">
<div class="arrow_up"><img src="images/arrow-up.gif" class="arrow_up_image"></div>
<div class="theImages">
<div style="top: 0px;">
';
} else {
//Afficher l'image en petit
echo '
<a href="#" title="image grand n"><img src="image petite n" title="titre image" alt="nom image"></a>
<div class="imageCaption">test nom</div>
';
}
$i++; //On ajoute 1 à notre variable
}
?>

<div class="slideEnd"></div>
</div>

</div>
<div class="arrow_down"><img src="images/arrow-down.gif" class="arrow_down_image"></div>
</div>
</div>

<div class="clear"></div>
</div>
<?php }
?>[/code]

Merci d'avance..

Bonjour,

Merci oui ça manque de précision.. même si je l'ai mis en haut du code :
[code]
.../..
<link rel="stylesheet" ..
<script type="text/javascript" ..
<script type="text/javascript" ..
.../..
[/code]

Alors j'ai utilisé les code de ce script avec son tuto et démo en mettant les fichiers et dossiers au bon endroit :

[url]http://www.dhtmlgoodies.com/index.html?whichScript=image-slideshow-vertical[/url]

Je pense que c'est dans le code que j'ai mis qu'il y a une erreur..

Cordialement.

[quote="julia"]Alors j'ai bien les images mini et la première image en grand d'affiché mais quand je click rien ne ce passe.[/quote]

Eh bien c'est normal, il n'y a aucun code qui est exécuté lorsque l'utilisateur clique.
Que veux-tu qu'il se passe lorsque l'utilisateur clique ? L'image sur laquelle clique devient grande et celle qui était grande devient petite ? Si c'est le cas, il va falloir utiliser du Javascript.

Bonjour,

J'ai trouvé, c'est pas zoom qu'il fallait que je cherche mais slideshow avec vertical filmstrip..

Alors du coup je reprend le code initial donné :

[code]
<?php
if (MAX_IMG_NUM>0){?>
<div id="pictures">
<?php
$i = 0; //On instaure notre variable
foreach($itemImages as $img){
if ($i == 0) { //Si $i = 0, alors on est sur la première image
//Afficher l'image en grand
} else {
//Afficher l'image en petit
}
$i++; //On ajoute 1 à notre variable
}
?>
<div class="clear"></div>
</div>
<?php }
?>
[/code]

Pour reprendre ce code en exemple:

[code]
<div class="dhtmlgoodies_slideshow">
<div class="previewPane">
<img src="images/image1_big.jpg">
<span class="waitMessage"><img src="images/wait.gif"></span>
<div class="largeImageCaption">blabla sous image 1</div>
</div>
<div class="galleryContainer">
<div class="arrow_up"><img src="images/arrow-up.gif" class="arrow_up_image"></div>

<div class="theImages">
<div style="top: 0px;">

<a href="#" title ="images/image1_big.jpg"><img src="images/image1.jpg"></a>
<a href="#" title ="images/image2_big.jpg"><img src="images/image2.jpg"></a>
<a href="#" title ="images/image3_big.jpg"><img src="images/image3.jpg"></a>
<a href="#" title ="images/image4_big.jpg"><img src="images/image4.jpg"></a>
<a href="#" title ="images/image5_big.jpg"><img src="images/image5.jpg"></a>
<a href="#" title ="images/image6_big.jpg"><img src="images/image6.jpg"></a>
<a href="#" title ="images/image7_big.jpg"><img src="images/image7.jpg"></a>
<a href="#" title ="images/image8_big.jpg"><img src="images/image8.jpg"></a>
<div class="imageCaption">This is the caption of image number one. It is placed inside a div in the html code.</div>
<div class="imageCaption">This is the caption of image number two</div>
<div class="imageCaption">This is the caption of picture number three</div>
<div class="imageCaption">Another caption for a picture in this slideshow</div>
<div class="imageCaption">This is the caption of image number five</div>
<div class="imageCaption">This is the caption of image number six</div>
<div class="imageCaption">This is the caption of image number seven</div>
<div class="imageCaption">This is the caption of image number eight</div>

<div class="slideEnd"></div>
</div>

</div>
<div class="arrow_down"><img src="images/arrow-down.gif" class="arrow_down_image"></div>
</div>
</div>
[/code]

j'ai donc tenté ce code :

[code]
.../..
<link rel="stylesheet" ..
<script type="text/javascript" ..
<script type="text/javascript" ..
.../..
<?php
if (MAX_IMG_NUM>0){?>
<div id="pictures">
<?php
$i = 0; //On instaure notre variable
foreach($itemImages as $img){
if ($i == 0) { //Si $i = 0, alors on est sur la première image
//Afficher l'image en grand
echo '
<div class="dhtmlgoodies_slideshow">
<div class="previewPane">
<img src="image en grand 1" >
<span class="waitMessage"><img src="images/wait.gif"></span>
<div class="largeImageCaption"></div>
</div>
<div class="galleryContainer">
<div class="arrow_up"><img src="images/arrow-up.gif" class="arrow_up_image"></div>
<div class="theImages">
<div style="top: 0px;">
';
} else {
//Afficher l'image en petit
echo '
<a href="#" title="image grand n"><img src="image petite n" title="titre image" alt="nom image"></a>
<div class="imageCaption">test nom</div>
';
}
$i++; //On ajoute 1 à notre variable
}
?>

<div class="slideEnd"></div>
</div>

</div>
<div class="arrow_down"><img src="images/arrow-down.gif" class="arrow_down_image"></div>
</div>
</div>

<div class="clear"></div>
</div>
<?php }
?>
[/code]

Alors j'ai bien les images mini et la première image en grand d'affiché mais quand je click rien ne ce passe.

Avez-vous une idée ou j'ai mal schmilbliqué le code ?

Merci d'avance..

Bonsoir,

Merci encore mais ça n'a pas marché, j'ai tenté "none" et non..

Mais j'ai trouvé, à la place de ce code :
[code]
$tracker = $('<div class="zoomtracker" style="cursor:progress;position:absolute;z-index:'+basezindex+';left:'+o.left+'px;top:'+o.top+'px;height:'+h+'px;width:'+w+'px;" />')
[/code]
j'ai fait :
[code]
$tracker = $('<div class="zoomtracker" />')
[/code]

Mais ça me complique la vie, il y a franchement pas plus simple ? :idea:

Bonjour,

Merci, c'est tout :shock:

Je suis si nul que ça #-o

Je regarde ça demain..

Merci encore..

Le curseur "+" est appelé : "crosshair"

Dans le script que tu as téléchargé, il y a la ligne :

[quote="dynamicdrive.com"]Inside the .js file, you may wish to edit the below two variables near the top:

[code]loadinggif: 'spinningred.gif', //full path or URL to "loading" gif
magnifycursor: 'crosshair', //Value for CSS's 'cursor' attribute, added to original image[/code][/quote]

En gros, il faut modifier dans le fichier [url]http://www.dynamicdrive.com/dynamicindex4/multizoom.js[/url] la ligne [code]magnifycursor: 'crosshair', //Value for CSS's 'cursor' attribute, added to original image[/code] par [code]magnifycursor: 'default', //Value for CSS's 'cursor' attribute, added to original image[/code]

Bonjour,

Une idée ou deux svp ?

Cordialement.

Bonjour,

Merci mais je n'arrive à faire marche ce code qu'en local, voilà ce que j'ai :

[code]
function ChangeImage(url) {
document.getElementById("monid").src = url;
}
[/code]

[code]
<img id="monid" src="imageGrande.jpg" />

<img src="imageMini.jpg" onClick="document.getElementById('monid').src='imageGrande.jpg';" />
[/code]

J'ai trouvé un script mais là encore je n'arrive pas à enlever le curseur "+" qui flote sur l'image pour le reste tout est ok, le voici :

http://www.dynamicdrive.com/dynamicindex4/featuredzoomer.htm#descArea

Je ne cherche qu'à afficher l'image rien de plus.

Merci encore de toute aide.

en javascript, quelque chose du genre :
<img src="petiteimage1.jpg" onclick='document.GetElementById("idgrandeimage").src = "nomimage.jpg"' />

Bonjour,

Merci encore ça marche, j'ai du loupé un truc !

Bref merci encore.

J'ai une autre question lié à ça.

Je cherche le nom d'un script qui permette, en cliquant sur une image miniature (à droite) qui fera apparaître la photo sur la même page à la place de l'autre grande image (à gauche) au même endroit.

Voir image jointe..

[img]http://img11.hostingpics.net/pics/187051Sanstitre1.jpg[/img]

Merci de toute aide..