Faire défiler des images (pour SAM peut-être)

Le 14/09/12 22:14, jmrw a écrit :

Bonjour,

Sur la page http://www.jmrw.com/Chess/Tableau_echecs/index.htm

il n'y a pas de bouton "stop" pour la zick ?
(que je n'entends pas)

Eh ben !
Cette organisation en <table> ça nous met un foutoir dans le code !
et dans la lecture par un vocalisateur itou !
Comment mettre en regard l'image et son texte associé alors qu'ils ne
sont pas dans le même groupe parent ?

se trouvent environ 500 images jpg

sont-elles dans un seul et même dossier ?
portent-elles le même nom plus un numéro ?
... non ... il y a au moins Alphonso qui diffère
et ... pour les numéros ... faudrait avoir :
- 001
- 010
- 100
et pas un coup 01, un coup 010
(tous les chiffres de même longueur !!!)

sinon il faudra d'abord créer un array de ces images

var monAlbum = [
'photos01/tartempion.jpg',
'photos02/trucmuche.jpg',
'photos01/grand_joueur.jpg'
];

que je voudrais faire défiler à une certaine cadence.
Y a-t-il une solution javascript pour faire cela?

oui

mais ...

comment comptes-tu t'y prendre pour y associer :
- le ALT de chaque vue (*)
- titre et légende de chaque vue
- le lien vers la page correspondante

(*) non le ALT ne sert pas à titre-buller l'image
il y a l'attribut 'title' pour faire ça
Là, moi je n'ai aucune info-bulle au survol des images



JS :
===
var nb = 500, // nombre d'images
f = 'thumbnails', // chemin vers dossier des images
I = [], // un array (vide)
play = false, // gestion marche/arret
tempo = 2000, // délai (en millisecondes)
c = 0; // un compteur

function preLoad() { // met toutes les images en cache
var n = c;
while(n.length<3) n = '0'+n;
if(c < nb) {
I[c] = new Image();
I[c].onload = preload;
I[c].src = f + '/' + n + '.jpg';
c++;
}
else {
c = 0;
diaporama();
}
}

function diaporama() {
c++;
if(c >= nb) c=0;
document.images.viewer.src = I[c].src;
play = setTimeout('diaporama()',tempo);}
}

function stop() {
clearTimeout(play);
play = false;
}

// démarrage automatique :
window.onload = diaporama;



HTML :
=====
<div>
<p><img name="viewer" src="album_01/100.png" alt="ecran"></p>
<p><button id="but1" onclick="if(!play)diaporama();">play</button>
<button id="but2" onclick="stop();">stop</button><p>
</div>



--
Stéphane Moriaux avec/with iMac-intel

Le 15/09/12 22:08, SAM a écrit :

JS :
=== >
var nb = 500, // nombre d'images

blabla

function voir() { // lien JS vers page associée
var n = c;
while(n.length<3) n = '0'+n;
location = 'pages/' + n + '.html';
}


HTML :
=====
<div>
<p><img name="viewer"
src="thumbnails/001.jpg" alt="ecran" onclick="voir()"></p>
<p><button id="but1" onclick="if(!play)diaporama();">play</button>
<button id="but2" onclick="stop();">stop</button><p>
</div>


--
Stéphane Moriaux avec/with iMac-intel

Encore une fois vous êtes formidable.

Les images commençant par Alfonson n'ont pas besoin d'être affichées.

Pour le moment j'ai utilisé Youtube (voir sur
http://www.jmrw.com/Chess/Tableau_echecs/index.htm#)

Cela ne me semble pas une mauvaise solution. De plus il y a de la musique.
Et puis comme cela pas besoin de télécharger les images depuis mon site.

Inconvénient : Quand je rajoute des tableaux la vidéo n'est plus à jour.

Je vais encore étudier la solution javascript.

Encore tous mes remerciement

jmrw

Le 16/09/12 19:26, jmrw a écrit :

Encore une fois vous êtes formidable.

Les images commençant par Alfonson n'ont pas besoin d'être affichées.

Pour le moment j'ai utilisé Youtube (voir sur
http://www.jmrw.com/Chess/Tableau_echecs/index.htm#)

Je ne suis pas allé voir, mais pour moi c'est parfais :
- pas de vidéo (encombrante, lourde et pourquoi faire ?)
- pas de zick (qui me polluerait l'environnement)

Si, j'y suis allé ... pas ni rien en vidéo :-(


Ha!? si, tout à la fin ... après le chargement (laborieux) du reste
... 4800 ko d'images !!! (et en 489 images)

Enfin ... j'en ai l'emplacement vide (grâce à mon Flash-Bloqueur) ouf!


Purée ! Ça a dû être du boulot à réaliser !

Cela ne me semble pas une mauvaise solution. De plus il y a de la musique.
Et puis comme cela pas besoin de télécharger les images depuis mon site.

C'est juste plus pire
... combien pèse la vidéo ? à charger dans son ordi depuis Yutub

Mazette ! 42 Mo !!!!

Inconvénient : Quand je rajoute des tableaux la vidéo n'est plus à jour.

Ah! Pour sûr !

et puis ... elle n'embarque pas les liens non plus.

Normalement, du moins l'espère-je, la routine JS ne devrait pas
encombrer + le cache du navigateur (avec les images).

Pour la zick il y a ça : <http://www.alsacreations.fr/dewplayer.html>
(au moins on peut l'arrêter avant que Vivaldi ne nous endorme)
(et pour ceux qui sont émoustillés par ce compositeur pourront même
monter le son et refaire jouer tel ou tel morceau de la liste)

--
Stéphane Moriaux avec/with iMac-intel

Comme vous le savez, je suis nul en javascript.

J'ai ajouté le code que vous m'avez fourni sur la page
http://www.jmrw.com/Chess/Tableau_echecs/index.htm

J'ai du faire quelque chose de travers, car pour le moment cela ne marche
pas.

Pour le lecteur mp3 j'ai peur que le téléchargement du mp3 qui serait pris
sur mon site me consommerait trop.

Merci

jmrw
(nul en javascript)

Ici

var nb = 500, // nombre d'images
f = 'thumbnails', // chemin vers dossier des images
I = [], // un array (vide)
play = false, // gestion marche/arret
tempo = 2000, // délai (en millisecondes)
c = 0; // un compteur

j'ai remplacé les , par des ;


Là j'ai remplacé

function diaporama() {
c++;
if(c >= nb) c=0;
document.images.viewer.src = I[c].src;
play = setTimeout('diaporama()',tempo);}
}

par

function diaporama() {
c++;
if (c >= nb) {c=0;
document.images.viewer.src = I[c].src;
play = setTimeout('diaporama()',tempo);}
}

maintenant je n'ai plus d'erreurs sur la page mais quand j'appuie sur play,
il ne se passe rien.


jmrw

Le 20/09/12 08:46, jmrw a écrit :

Ici

var nb = 500, // nombre d'images
f = 'thumbnails', // chemin vers dossier des images
I = [], // un array (vide)
play = false, // gestion marche/arret
tempo = 2000, // délai (en millisecondes)
c = 0; // un compteur

j'ai remplacé les , par des ;

complètement inutile
et même néfaste
==> la déclaration de chaque variable n'est pas précédée de 'var'

alors qu'avant, 'var' était pour toutes les déclarations de variables
jusqu'à atteindre un ';'

Là j'ai remplacé

function diaporama() {
c++;
if(c >= nb) c=0;
document.images.viewer.src = I[c].src;
play = setTimeout('diaporama()',tempo);}
}

par

function diaporama() {
c++;
if (c >= nb) {c=0;
document.images.viewer.src = I[c].src;
play = setTimeout('diaporama()',tempo);}
}

maintenant je n'ai plus d'erreurs sur la page

pask'y s'passe plus rien, pardine !

La preuve :

mais quand j'appuie sur play, il ne se passe rien.

ben oui puisque avec
if ( truc) {
fait-ci;
fait-ça;
}
si truc est faux on ne fera ni ci ni ça, pas vrai ?

et comme c (alors qu'il égale 0 ou p't'êt' 1)
n'est pas supérieur au total des vues
la condition est fausse ... passez vot' chemin y a rien à voir !

Que veut dire :
if(c >= nb) c=0;
si le compteur dépasse ou égale le nombre total de vue,
hop! on le repasse à zéro


Méthode par changement de class :
<http://cjoint.com/?BIvaWWGC7WS>
<http://cjoint.com/12sp/BIvaWWGC7WS_chess-tableaux-sam-0_index.htm>

Méthode par changement d'image :
<http://cjoint.com/?BIvaYBuZTSK>
<http://cjoint.com/12sp/BIvaYBuZTSK_chess-tableaux-sam-1_index.htm>

--
Stéphane Moriaux avec/with iMac-intel

Le 21/09/12 00:57, SAM a écrit :

Méthode par changement d'image :

Tentative de nettoyage ! ! ! !
hors les images, la 1 : 250ko, la 2 : 190 ko, l'originale : 350 ko

Mise en forme avec des tables
<http://cjoint.com/?BIvwv7FHUnK>
comme je n'ai rien ni compris à ces span et em stylés n'importe comment
zou ! je les ai un peu zappés (pas recontrôlé les codes de ...)

Mise en forme sans table :
<http://cjoint.com/?BIvwFLk9vXH>
cette fois avec simplification+contrôle des span
(enfin ... des em puisk'y a plus de span)


--
Stéphane Moriaux avec/with iMac-intel

Vous avez encore fait quelque chose de formidable.


Sous Firefox c'est exactement ce que je voulais ( j'affiche les images et
non les vignettes)

Voir http://www.jmrw.com/Chess/Tableau_echecs/index.htm


Sous Internet Explorer il reste des petits détails à règles, je verrai ça
demain.

Je ne sais comment vous remercier.

jmrw



"SAM" <stephanemoriaux.NoAdmin@wanadoo.fr.invalid> a écrit dans le message
de news: 505cd006$0$21244$ba4acef3@reader.news.orange.fr...

Le 21/09/12 00:57, SAM a écrit :

Méthode par changement d'image :

Tentative de nettoyage ! ! ! !
hors les images, la 1 : 250ko, la 2 : 190 ko, l'originale : 350 ko

Mise en forme avec des tables
<http://cjoint.com/?BIvwv7FHUnK>
comme je n'ai rien ni compris à ces span et em stylés n'importe comment
zou ! je les ai un peu zappés (pas recontrôlé les codes de ...)

Mise en forme sans table :
<http://cjoint.com/?BIvwFLk9vXH>
cette fois avec simplification+contrôle des span
(enfin ... des em puisk'y a plus de span)


--
Stéphane Moriaux avec/with iMac-intel

Une amélioration serait de permettre à l'utilisateur de modifier la vitesse
de défilement

jmrw