Scriptt pour comptage et défilement nombre d'image

Résolu

stff406 Messages postés 2 Date d'inscription mercredi 20 janvier 2010 Statut Membre Dernière intervention 25 février 2011 - 24 févr. 2011 à 18:11
stff406 Messages postés 2 Date d'inscription mercredi 20 janvier 2010 Statut Membre Dernière intervention 25 février 2011 - 25 févr. 2011 à 15:31

Bonsoir à tous,

J'aimerais savoir s'il serait possible d'insérer un petit affichage indiquant à quelle numéro d'image on se situe et le nombre total d'image défilant ?
En image ce que je souhaiterais faire :
http://img694.imageshack.us/img694/9193/sanstitreofz.png

J'ai,réutilisé un code déjà existant pour effectuer mon défilement d'image.
Voici le code qui faudrait pouvoir adapter dans la mesure du possible :

Merci d'avance pour votre aide.

<script language="JavaScript">

</script>

A voir également:

Scriptt pour comptage et défilement nombre d'image
Convolution image - Conseils pratiques -Java
Fpdf image ✓ - Forum PHP
Vectoriser une image photoshop ✓ - Forum Graphisme/design
Nombre aléatoire entre 1 et 16 ✓ - Forum PHP
Inverser une image photoshop - Forum Graphisme/design

2 réponses

Réponse 1 / 2

007Julien Messages postés 276 Date d'inscription mercredi 22 septembre 2010 Statut Membre Dernière intervention 8 janvier 2014 4
25 févr. 2011 à 12:16

Ce script assez maladroit (3 fonctions sont pratiquement identiques) et inutilement compliqué (création d'un objet pour numéroter les images de 1 à n alors qu'un simple tableau d'images numérotées de 0 à n-1 est suffisant) pourrait être utilement modifié en tirant parti du prototype suivant.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="fr">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="generator" content="PSPad editor, www.pspad.com">
<title>Images numérotées</title>
<style type="text/css">
#cnt {display:block;width:400px;height:400px;margin:20px auto;border:1px solid red;}
img {display:block;margin:0 auto;width:300px;height:300px;border:1px solid yellow;}
p {text-align:center;}
</style>
</head>





[javascript:newImg(-1) «]  [javascript:newImg(0) auto]  [javascript:newImg(+1) »]




<script type="text/javascript">
var tab=new Array("01.jpg","02.jpg","03.jpg","04.jpg","05.jpg"),lgn=tab.length,num=-1,rll=false;
function newImg(d,b){
num=(num-(-d)+lgn)%lgn;
document.getElementById('idm').src=tab[num];
document.getElementById('lgd').innerHTML=(num+1)+" / "+lgn;
if (!b && rll) {auto();return}
if (rll) setTimeout('newImg(1,1)',1000);
}
function auto(){
rll=!rll;
if (rll) document.getElementById('ida').innerHTML="stop";
else document.getElementById('ida').innerHTML="auto";
if (rll) newImg(1,1);
}
newImg(+1);
</script>

</html>

Les images sont contenues dans le tableau tab, elles sont au nombre de lgn (la longueur du tableau) et num désigne l'image en cours d'affichage (initialisée à -1). La variable rll est initialisée à faux.
La fonction newImg change l'image affichée en augmentant de d (comme delta + ou -1) le numéro de l'image (on augmente de -(-d) pour être certain de ne pas concaténer et on travaille sur les restes dans la division par lgn pour avoir toujours un numéro compris entre 0 et num-1). Enfin le booléen b (vrai ou faux) permet de savoir d'où vient l'ordre de changement d'image pour l'arrêter si l'utilisateur clique sur une flèche.

Réponse 2 / 2

stff406 Messages postés 2 Date d'inscription mercredi 20 janvier 2010 Statut Membre Dernière intervention 25 février 2011
25 févr. 2011 à 15:31

C'est parfait ! En plus de ton code, les explications sont tout à fait claire. J'ai réussi à adapter comme je le souhaitais.

Merci beaucoup.

Discussions similaires

Défilement automatique d'une page

génerateur de nombre aléatoire

defilement automatique pdf en boucle

Calcul du n-ième nombre premier

Nombre de semaines dans l'année

Votre réponse

Discussions similaires