Slideshow d'images en Flash

Dans la lignée des petites animations utiles, voici le dewslider (yeah wanégaine). C'est dans la même veine que l'animation pour lire les mp3, mais cette fois-ci il s'agit de faire défiler des images choisies de façon minimaliste.

Edit : Mise à jour et nouvelle version par ici : Dewslider

Les images sont chargées dynamiquement, au fur et à mesure du défilement, et sont redimensionnées automatiquement. La taille standard est multiple de 640x480, 1024x768, 1600x1200... (un classique rapport de 1.33), les autres formats étant ajustés au plus proche sans être déformés.

Pour plus de souplesse, la liste des fichiers à afficher est passée en argument de cette façon dans le code HTML : ?img=image1.jpg,image2.jpg et ainsi de suite. Il est possible de préciser des chemins relatifs. Voici le code exemple (attention il y a 2 endroits où spécifier les adresses des images séparées par des virgules, ceci suppose que vous placez le fichier swf dans le même répertoire que les images) :

<object type="application/x-shockwave-flash" data="dewslider.swf?img=img1.jpg,img2.jpg,img3.jpg" width="520" height="420"> <param name="movie" value="dewslider.swf?img=img1.jpg,img2.jpg,img3.jpg" /> </object>

Vous pouvez l'adapter à la couleur de fond de votre site par l'utilisation de <param name="bgcolor" value="#ffffff" /> (ici du blanc).

33 commentaires pour “Slideshow d'images en Flash”

  1. Antoine dit :

    Ou bien dans un xml… Non ? c’est pas mieux ? Plus simple ?

  2. magicnico dit :

    Dans le meme genre il y a ça qui est vraiment tres bien fait
    http://www.airtightinteractive.c...
    Ca marche avec un xml et les images sont prechargés…
    Il gere aussi un system de caption et on peut customiser les couleurs…
    Le seul probleme (bordure) c’est qu’il possede une large bordure et du coup les images s’en trouve souvent bien reduite si on ne veut pas l’utiliser dans une page complete…

  3. NoOne dit :

    Euh moi le système de dew me convient tout a fait. Ce genre de Slideshow c’est l’idéal pour un blog, on veut mettre plusieurs images dans un post a la fin sans prendre trop de place, et hop Dewslider arrive a la rescousse =)
    Avec un fichier XML ça impose d’uploader le bidule, et on ne peut faire qu’un slideshow. Ou alors faudrait passer l’url du fichier XML a charger en paramètre…
    Non il est bien comme ça stout =)

  4. dew dit :

    Mise à jour avec transitions pour éviter les blancs.

  5. otcho dit :

    Bug: Quand on clique trop vite sur un bouton, les images deviennent blanches et plus moyen de revenir à l’ancienne configuration.

  6. otcho dit :

    (en fait c’est toutes les images d’indice impair qui souffrent du bug)

  7. dew dit :

    C’est corrigé, merci pour le bug report.

  8. mauriz dit :

    Ca rox comme truc, léger parfait pour les petites faims.
    Juste un détail, ce serait peut être mieux avec des boutons plus neutres, non?

  9. [ NikO ] dit :

    Salut
    Pourquoi ne pas filer le fla ?
    J’avais fait un truc dans le genre : niko.informatif.org/flash/Ndiapo.zip niko.informatif.org/flash/Ndiapo03.zip. Voir quelques explications ici : Php Xml et Ndiapo.

  10. OlivierM dit :

    Je cherche un truc pour faire des retouche simple sur des images, avant upload et aprés upload. Un flash serait idéal pour faire ca ! Mais je n’arrive pas à trouver… déjà vu ca ?

  11. Edmond dit :

    Tout d’abord merci pour ce petit utilitaire :)
    J’ai un soucis : les images se charge (le preload en % s’affiche bien en indiquant le poids) mais tout reste blanc et rien ne s’affiche !
    J’ai essayé d’écrire les urls des imgs en relatif et en absolu…rien n’y change.

    Alors doc c’est grave ? ;)

  12. [ NikO ] dit :

    OlivierM> tu ne peux pas faire de retouche photo avec flash !

  13. dota dit :

    J’ai le même problème de page blanche ……

  14. mat dit :

    On a le lecteur pour les mp3, le lecteur pour les images… manque plus que les vidéos!!! (Est ce que c’est possible de faire un lecteur vidéo AVI en flash? je suppose que ça poserait pb au niveau des codecs?)

    C’est très simpa Dew de faire partager ton travail, surtout que c’est très réussi!

  15. dew dit :

    @mauriz > je vais rajouter une option pour des boutons plus conventionnels, ainsi qu’une option pour désactiver le cadre (n’afficher que l’image).

    @NikO > désolé, je ne peux pas pour l’instant (et puis ce n’est pas extrêmement dur à faire, donc ceux qui peuvent ouvrir les .fla doivent être en mesure de le recréer facilement).

    @OlivierM > oui cela doit être possible, dans certaines limites, car il existe des scripts générant des images ou permettant de les recadrer.

    Pour les pages blanches, vérifiez que vous avez bien modifié les urls aux deux endroits. Apparemment Edmond a triomphé.

    @mat > oui il est possible de faire un lecteur de vidéo, j’ai déjà commencé à jeter un coup d’oeil. mais cela impose de convertir la vidéo au format .flv. je ne me rappelle plus exactement si le convertisseur fourni par macromedia est gratuit. si tel est le cas, j’essaierai de faire un player.swf pour ces vidéos.

  16. phisto dit :

    Magnifique, aussi bien que le dew player mais est ce que tu pourrais mettre une fonction automatique à ton lecteur qu’on reglerait dans le code : du genre mode="auto" et time="7000" pour un defilement automatique à 7 sec.
    Bye

  17. khalid dit :

    salut tt…. le monde?

  18. ashok dit :

    Alors j’ai trouvé un encodeur en freeware pour faire du FLV : http://www.rivavx.com/index.php?... . Si ça peut te motiver….

    OK ok ok je sais, c’est uniquement sous windows mais bon c’est déjà ça.

  19. youcoups dit :

    Bonjour,
    Je voudrais savoir si il n’y auré pas moyen de changé la couleur de fond ( qui est blanc par défault). Parceque en fait la couleur de fond de mon site est noir et lorsque une photo ne fais pas une taille standart (480*360) la couleur pour compléter la photo est blanche.

    Voila, et merci à toi Dew de mettre à disposition ceci: c’est exactement ce que je veux à part juste un ce détail :d !

  20. Donk dit :

    youcoups>>
    dixit dew:
    "Vous pouvez l’adapter à la couleur de fond de votre site par l’utilisation de <param name="bgcolor" value="#ffffff" /> (ici du blanc)."

  21. Fred dit :

    Je commence à utiliser cet outil sur mon blog.
    Ici -> yakalire.free.fr/index.ph…

    Mais, (il y a parfois un "mais") j’aimerai savoir s’il est possible de passer en slideshow toutes les images d’un répertoire sans avoir à spécifier le chemin pour chacune d’elle ?

    Merci d’avance pour la réponse ;-)

  22. laetitia dit :

    @Dew > je vais rajouter une option pour des boutons plus conventionnels, ainsi qu’une option pour désactiver le cadre (n’afficher que l’image).

    ça m’arrangerais si tu pouvais me communiquer le changement :)

    vu que j’utilise ton système pr un site et que les photos n’ont pas du tt le meme format, alors le cadre est un peu vide par moment :s

    en tout cas c’est génial comme système :)

  23. gwinglañv dit :

    Salut ! J’ai incorporé ton code dans une de mes pages, mais celà ne marche pas : lorsque je test mon site en local via dreamweaver, celà marche convenablement, mais lorsque j’upload le tout, l’animation flash, à la place de 1/5(par ex) me met "pas d’images"…
    tu peux voir ma page sur mon site : celtic.provence.free.fr/b…
    Sinon, j’ai mis tous les fichiers dans le même répertoire : page html, fichier .swf, et photos, mais à la limite, j’aimerais autant que l’animation aille chercher les photos dans un repertoire spécifique puisque je veux faire une visionneuse pour les photos défilés, les photos de répétitions ou encore les photos de concerts…Voici mon code :

    <object type="application/x-shockwave-flash" data="dewslider.swf" width="520" height="420"> <param name="movie" value="dewslider.swf?img=avel.jpg,bertrand.jpg,elodie.jpg,jeff.jpg,lionel.jpg,michelle.jpg,patrick.jpg,quentin.jpg,ronan.jpg,toff.jpg" />
    <embed src="dewslider.swf?img=avel.jpg,bertrand.jpg,elodie.jpg,jeff.jpg,lionel.jpg,michelle.jpg,patrick.jpg,quentin.jpg,ronan.jpg,toff.jpg" width="520" height="420"></embed>
    <param name="bgcolor" value="#F9F9F9" />
    </object>

    Peux-tu me dire d’où vient le problème s’il te plaît ? (réponds moi par e-mail de préférence stp ^_^)

  24. Gwinglañv dit :

    Excuse moi pour le "double-posting", mais je viens de me rendre compte, que cela marchait très bien avec internet explorer…j’utilise habituellement firefox, c’est pour cela que je ne m’en suis pas rendu compte : donc avec IE, cela marche, mais pas avec Firefox ! Or, je visualise très bien ta visionneuse qui se trouve sur cette page ! Et pourtant, j’utilise Firefox…connais-tu ce problème ?

  25. lamnini dit :

    saliut sa va moi si ali

  26. lamnini dit :

    saliut sa va moi si ali

  27. Milou' dit :

    Bonsoir Gwinglañv,
    J’ai exactement le même problème que vous.
    Mon diaporama fonctionne parfaitement en local sous Dreaweaver.
    Dès que j’upload le tout chez mon fournisseur Free.Fr, le diaporama est fonctionnel sous IExplorer mais pas sous Firefox avec la mention "Pas d’images" ???
    Avez-vous solutionné ce problème ?

    J’ai mis à jour Firefox + Shockwave + Flash : rien n’y fait…

    Merci d’avance pour toute proposition.

  28. nothing08 dit :

    salut

  29. ghost dit :

    bonjour voila suis débutant et je voudrai insérer ce code dans ma page que je construis

    <body>

    " <object type="application/x-shockwave-flash" data="?img=moi.jpg,elle.jpg,eux.jpg" width="520" height="420"> <param name="movie" value="dewslider.swf?img=moi.jpg,elle.jpg,eux.jpg" /> </object> "

    </body>

    et l’ai télécharge le dewslider.swf et mis dans le même répertoire que mes image mais lorsque je lance le navigateur je ne vois rien ?!?! voima si vous pouver m’aider

  30. popov dit :

    Tous simple genial, c’est exactement ce que je recherche car je trouve que le classique rotate.php est un peu…obsolète !

    Franchement merci beaucoup pour ces infos ;)

  31. Sylvain dit :

    Super ce petit outil, merci beaucoup et bonne continuation. Je vais m’en servir pour mon site http://www.moto-group.com

  32. doudouce dit :

    bonjour,

    merci pour cet outil très fonctionnel…

    seul souci, il semblerait que l’on ne puisse pas utiliser plus de 20 images…

    vous confirmez ? chez moi il revient à la première après la 20e…

    merci

  33. Elpatator dit :

    Bonjour,
    merci pour cet outil.
    Touttefois, j’ai un probleme : j’utilise des PNG, pour profiter de leur transparence. Et la, surprise, mes images se superposent les unes aux autres ! n’est il pas possible d’avoir acces au code source pour modifier ce bug ?
    Merci !

Laisser un commentaire