Twitter iPhone pliant OnePlus 11 PS5 Disney+ Orange Livebox Windows 11

Slideshow & co

2 réponses
Avatar
Damien
Bonjour,
Je me permets ce petit message afin d'avoir un peu d'aide sur le
script suivant : http://www.phatfusion.net/multibox/

Dans un premier temps j'aimerais pouvoir ajouter =E0 ce dernier une
fonction de "diaporama" automatique (un bouton "lecture" qui fait
d=E9filer les images toutes les x secondes). Malheureusement mon niveau
de connaissance en javascript =E9tant tr=E8s tr=E8s sommaire je ne vois
vraiment pas comment r=E9aliser ce genre de chose, si quelqu'un pouvait
m'=E9clairer ?...

Dans un second temps,
les images qui constituent mon diaporama sont d=E9clar=E9es de la mani=E8re
suivante (la toute premi=E8re image(IMG_8966.jpg) servant de lien pour
afficher les autres qui, elles sont cach=E9es (d'o=F9 le "display:none") :


[code]

<a href=3D"files/IMG_8966.jpg" id=3D"mb1" class=3D"mb" title=3D"Image Title =
1
(jpg)"><img src=3D"files/tIMG_8966.jpg" alt=3D"" border=3D"0" /></a>
<div class=3D"multiBoxDesc mb1">This is my descrition text 1. It can
support html.</div>

<div style=3D" display:none">

<a href=3D"files/IMG_6608.jpg" id=3D"mb2" class=3D"mb" title=3D"Image Titl=
e
2 (jpg)"></a>
<div class=3D"multiBoxDesc mb2">This is my descrition text 2. It can
support html.</div>

<a href=3D"files/IMG_7210.jpg" id=3D"mb3" class=3D"mb" title=3D"Image Titl=
e
3 (jpg)"></a>
<div class=3D"multiBoxDesc mb3">This is my descrition text 3. It can
support html.</div><br />

</div>

[/code]

Vous comprendrez que ce genre de chose est valable pour une petite
quantit=E9e d'image mais dans mon cas j'ai environ 70 images =E0 entrer,
ce qui risque d'=EAtre plut=F4t long et fastidieux...
C'est pourquoi je me demandais s'il n'y avait pas moyen d'=E9crire la
m=EAme chose mais sous forme de tableau, du genre :

[code]
new Array('files/IMG_8966.jpg', 'id', 'class', 'title', 'multiboxdesc
mb2'),
new Array('files/IMG_7210.jpg', 'id', 'class', 'title', 'multiboxdesc
mb3'),

//etc...
[/code]

Mais bon l=E0 encore, mon niveau de connaissance ne me permet pas de
faire ce genre de chose (d'autant que je ne sais m=EAme pas si c'est
r=E9alisable).

D'avance merci pour votre aide,

-----------
Damien

2 réponses

Avatar
SAM
Bonjour,
Je me permets ce petit message afin d'avoir un peu d'aide sur le
script suivant : http://www.phatfusion.net/multibox/

Dans un premier temps j'aimerais pouvoir ajouter à ce dernier une
fonction de "diaporama" automatique (un bouton "lecture" qui fait
défiler les images toutes les x secondes). Malheureusement mon niveau
de connaissance en javascript étant très très sommaire je ne vois
vraiment pas comment réaliser ce genre de chose, si quelqu'un pouvait
m'éclairer ?...


Là il faut demander à mootools, non ?

pb : chez moi le popup se ferme très mal et laisse trainer un fantome
désagrégé du cadre noir qui continue à tout cacher la page dessous ...

Dans un second temps,
les images qui constituent mon diaporama sont déclarées de la manière
suivante (la toute première image(IMG_8966.jpg) servant de lien pour
afficher les autres qui, elles sont cachées (d'où le "display:none") :



si-dessous on peut remplacer diap.length par l'index
soit de 0 à 69 pour 70 images
mais ... bon ... serait-ce mieux ?


var diap = []
diap[diap.length] = [
'IMG_6608.jpg', // href du lien
'titre image', // title du lien
'description image' // contenu du div
]
diap[diap.length] = [
'IMG_66784.mov',
'titre mov',
'description mov'
]

function createGallery() {
var idx = 2;
var cible = document.getElementById('liste_cache');
for(var i=0; i<diap.length; i++) {
var a = document.createElement('A');
a.herf = diap[i][0];
a.id = 'mb'+idx;
a.class = 'mb'
a.title = diap[i][1];
cible.appendChild(a);
var d = document.createElement('DIV');
d.class = 'multiBoxDesc mb'+idx;
a.innerHTML = diap[i][2];
cible.appendChild(d);
idx++;
}
}
window.onload = createGallery;

[code]

<a href="files/IMG_8966.jpg" id="mb1" class="mb" title="Image Title 1
(jpg)"><img src="files/tIMG_8966.jpg" alt="" border="0" /></a>
<div class="multiBoxDesc mb1">This is my descrition text 1. It can
support html.</div>


<div style=" id="liste_cache" display:none">

</div>

[/code]

Vous comprendrez que ce genre de chose est valable pour une petite
quantitée d'image mais dans mon cas j'ai environ 70 images à entrer,


ce serait mieux d'avoir une routine du côté serveur ... mais bon ...
dans la mesure où ici sur cette page sans JS rien ne fonctionne ou
presque ...

--
sm

Avatar
Damien
On 23 fév, 19:17, SAM
wrote:

Bonjour,
Je me permets ce petit message afin d'avoir un peu d'aide sur le
script suivant :http://www.phatfusion.net/multibox/

Dans un premier temps j'aimerais pouvoir ajouter à ce dernier une
fonction de "diaporama" automatique (un bouton "lecture" qui fait
défiler les images toutes les x secondes). Malheureusement mon niveau
de connaissance en javascript étant très très sommaire je ne vois
vraiment pas comment réaliser ce genre de chose, si quelqu'un pouvait
m'éclairer ?...


Là il faut demander à mootools, non ?

pb : chez moi le popup se ferme très mal et laisse trainer un fantome
désagrégé du cadre noir qui continue à tout cacher la page dessous ...

Dans un second temps,
les images qui constituent mon diaporama sont déclarées de la mani ère
suivante  (la toute première image(IMG_8966.jpg) servant de lien pou r
afficher les autres qui, elles sont cachées (d'où le "display:none") :


si-dessous on peut remplacer diap.length par l'index
soit de 0 à 69 pour 70 images
mais ... bon ... serait-ce mieux ?

var diap = []
diap[diap.length] = [
        'IMG_6608.jpg',       // href du lien
        'titre image',        // title du lien
        'description image'   // contenu du div
         ]
diap[diap.length] = [
        'IMG_66784.mov',
        'titre mov',
        'description mov'
         ]

function createGallery() {
var idx = 2;
var cible = document.getElementById('liste_cache');
for(var i=0; i<diap.length; i++) {
   var a = document.createElement('A');
   a.herf = diap[i][0];
   a.id = 'mb'+idx;
   a.class = 'mb'
   a.title = diap[i][1];
   cible.appendChild(a);
   var d = document.createElement('DIV');
   d.class = 'multiBoxDesc mb'+idx;
   a.innerHTML = diap[i][2];
   cible.appendChild(d);
   idx++;
   }}

window.onload = createGallery;

[code]

<a href="files/IMG_8966.jpg" id="mb1" class="mb" title="Image Ti tle 1
(jpg)"><img src="files/tIMG_8966.jpg" alt="" border="0" /></a>
<div class="multiBoxDesc mb1">This is my descrition text 1. It can
support html.</div>


<div style=" id="liste_cache" display:none">

  </div>

[/code]

Vous comprendrez que ce genre de chose est valable pour une petite
quantitée d'image mais dans mon cas j'ai environ 70 images à entrer,


ce serait mieux d'avoir une routine du côté serveur ... mais bon ...
dans la mesure où ici sur cette page sans JS rien ne fonctionne ou
presque ...

--
sm


Merci beaucoup pour cette réponse,
mais bon, suite à vos diverses remarques, je vais peut-être
m'orrienter vers une autre gallerie d'image,
puisque celle-ci ne semble pas fonctionner aussi bien que ça.

Encore Merci,

-------
Damien