DIAPORAMA (EFFET RETOURNEMENT DE L'IMAGE)

Messages postés
278
Date d'inscription
jeudi 22 février 2001
Statut
Membre
Dernière intervention
7 octobre 2013
- - Dernière réponse : cs_Muzz
Messages postés
3
Date d'inscription
jeudi 11 novembre 2004
Statut
Membre
Dernière intervention
2 avril 2009
- 2 avril 2009 à 09:41
Cette discussion concerne un article du site. Pour la consulter dans son contexte d'origine, cliquez sur le lien ci-dessous.

https://codes-sources.commentcamarche.net/source/16250-diaporama-effet-retournement-de-l-image

cs_Muzz
Messages postés
3
Date d'inscription
jeudi 11 novembre 2004
Statut
Membre
Dernière intervention
2 avril 2009
-
Bonjour bonjour! Je trouve ce script assez sympatique mais y'a quelques modifications que j'aurais voulu lui apporter, sans y parvenir. Donc si quelqu'un pouvait m'aider, ce serait vraiment très gentil! :D

J'aurais aimé créer un bouton pour qu'on puisse également revenir en arrière sur les images du diaporama, comme par exemple dans ce code-là :

<script type="text/javascript">
ejs_photo = new Array;
<?
$a = 0;
$handle = opendir("18ansfanny");
while (($file = readdir())!=false) {
clearstatcache();
if($file!=".." && $file!=".")
{
echo "ejs_photo[$a] = '18ansfanny/$file';
";
$a++;
}
}
closedir($handle);
?>
function ejs_aff_18ansfanny(num)
{
if(document.getElementById)
{
ejs_fin = "";
if(num!=0)
ejs_fin += "< Précédent ";
if(num!=(ejs_photo.length-1))
ejs_fin += "Suivant >";
document.getElementById("ejs_photo_box").innerHTML = "<CENTER>
"+ejs_fin+"</CENTER>";
}
}
window.onload = new Function("ejs_aff_18ansfanny(0)")

</script>
(code d'un script pour un autre diaporama, mais sans effet de retournement)
Je n'ai pas réussi à l'intégrer dans le code...

Merci de votre aide!
:D
Jeannotc
Messages postés
22
Date d'inscription
jeudi 1 avril 2004
Statut
Membre
Dernière intervention
29 septembre 2013
-
Bonjour,

Super ce script, mais comment résoudre le problème de l'affichage normal des photos suivantes à leur taille normale.
La première c bon, les autres sont toutes petites, comme toutes les images ne sont pas de la même taille, je ne peux pas renseigner les dimenssions dans la ligne <img name etc..)
Suis sur IE7 !
Après actualisation de la page c bon ! mais je peux pas demander aux internautes de le faire, ça fait désordre !
merci
cs_jerms
Messages postés
115
Date d'inscription
jeudi 8 mai 2003
Statut
Membre
Dernière intervention
3 janvier 2016
-
salut lordkriss, juste une question pourquoi mets tu le code javascript dans la <TABLE>, vaudrait-il pas mieux mettre toutes les fontcions dans <HEAD> ?

c'est le première chose qui me vient à l'esprit ca ne change peut être rien du tout.
lordkriss
Messages postés
6
Date d'inscription
mardi 21 septembre 2004
Statut
Membre
Dernière intervention
6 juin 2006
-
Je continue mon solliloque...

Pour le problème de taille d'image avec firefox, c'est résolu en remplaçant la ligne

par

(ou xxx est la largeur de vos images et yyy leur hauteur...)

En revanche, pour fonctionner sous IE, le script ne supporte pas d'être placé dans un tableau et je ne trouve pas de solution....
lordkriss
Messages postés
6
Date d'inscription
mardi 21 septembre 2004
Statut
Membre
Dernière intervention
6 juin 2006
-
Re-mes-homages...

J'ai deux petits problèmes avec le script :
1/ avec firefox, il faut rafraichir la page pour éviter que les images s'affichent en 1cm*1cm...

2/ En dehors de ça, le script fonctionne trés bien sous firefox et IE sur une page ne contenant que ça. Cependant, dés que je l'insère dans une page "habillée" il ne fonctionne plus sous IE (la première image apparait et tout disparait lorsque l'on clique dessus. Je vous poste le code la page en question dans l'espoir qu'oeil avisé trouvera le hic. (merci d'avance) :


<table width="742" height="532" border="0">
----, <table width=\"100%\" border=\"0\">
----

,

----

<script language="javascript">
var largDepart = 0
var hautDepart = 401
var numImg = 0
var timerRe = 0
var timerAg = 0
var vitesse = 15
var tabImage = new Array()
tabImage[0] = "plage.jpg"
tabImage[1] = "chateau.jpg"
tabImage[2] = "concert.jpg"
tabImage[3] = "parade.jpg"
var tabDesc = new Array()
tabDesc[0] = "Restrospective photographique de la Plage, édition 2007"
tabDesc[1] = "Activité incontournable de la plage : le chateau de sable"
tabDesc[2] = "Le week-end à la Plage, c'est concert !"
tabDesc[3] = "parade d'ouverture"

function init(obj) {
obj.src = tabImage[numImg]
obj.title = tabDesc[numImg]
largDepart = obj.width
hautDepart = obj.height
if (vitesse > largDepart) { vitesse = largDepart }
}

function changeImage(obj) {
if (timerAg != 0) {
clearTimeout(timerAg)
timerAg = 0
}if (timerRe 0) { timerRe setTimeout("retrecirImage("+obj.name+")",0) }
}

function agrandirImage(obj) {
if (obj.width < largDepart) {
if (obj.width+vitesse > largDepart) { obj.width = largDepart }
else { obj.width += vitesse }

obj.height = hautDepart
timerAg = setTimeout("agrandirImage("+obj.name+")",0)
}
else {
clearTimeout(timerAg)
timerAg = 0
}
}

function retrecirImage(obj) {
if (obj.width > 0) {
obj.width -= vitesse
obj.height = hautDepart
timerRe = setTimeout("retrecirImage("+obj.name+")",0)
}
else {
clearTimeout(timerRe)
timerRe = 0
obj.src = tabImage[(numImg+1)%tabImage.length]
obj.title = tabDesc[(numImg+1)%tabImage.length]
numImg++
timerAg = setTimeout("agrandirImage("+obj.name+")",0)
}
}
</script>

Survolez l'image pour lire la légende, cliquez pour la suite...

<script language="javascript">
init(image)
</script>
</td>
      </tr>
    </table></td>
  </tr>
</table>