Article: Smooth Slideshow v2.0

Smooth Slideshow v2.0

10/10/2006 - 23h08 Element appartenant à: Blog, Programmation, JavaScript, Sorties

JonDesign’s Smooth SlideShow Library
En utilisant mootools (pas d’inquiétude, une version avec moo.fx et prototype.lite.js est toujours disponible), ce système javascript de “slideshow” vous permet de placer sur votre site des présentations et autres vitrines simplement et avec des effets graphiques de qualité professionnelle.

Langues
This article is bilingual, view it in English.
Cet article est bilingue, vous le voyez actuellement en Français.

Liens Rapides
Aller directement sur le site de la bibliothèque (en Anglais)

Pour plus d’informations, voir l’annonce de la version 1.0

Quoi de neuf dans la version 2 ?
Tout en conservant des étapes d’installation similaires, une refonte en profondeur de l’architecture interne a été effectuée dans cette version.
Bon, mais quels sont les changements en détail ?

Tout le code est maintenant inclus dans des objets. En d’autres termes, vous pouvez ajouter plus d’un “slideshow” ou vitrine sur une même page.
JonDesign’s SmoothSlideshow centre maintenant les images dans son cadre. Ainsi, vous pouvez utiliser des images de différentes proportions au sein d’un seul et même “slideshow”.
Désormais, la bibliothèque mootools est utilisée en lieu et place de moo.fx et prototype.lite.js (mais, encore une fois, pas d’inquiétude, une v2.0 utilisant moo.fx est également disponible)
Quelques changements d’ordre graphique (la tendance évolue, et smoothslideshow reste à la mode ;))
Et pour finir, dernier point, et non des moindres: beaucoup de corrections de bugs.

Où le trouver et comment l’installer ?
Rendez-vous directement sur le site de la bibliothèque (en Anglais) !

Commentaires

Grummfy a commenté le 16 Octobre 2006 à 03h:

dommage qu'il n'y ai pas moyen de faire un slideshow directement à partir d'un dossier, par exemple via un script javascript(ou autre) qui générerait une liste de toutes les photo à charger, simplement, par après il suffirait de remplir les commentaires, s'il y lieu.

en tout cas chapeau, il y a longtemps j'avais fait une pseudo-galerie photo en js et c'était nettement moins bien fait ;)

valery a commenté le 18 Octobre 2006 à 00h:

Bonsoir et merci merci merci. Ca m'a vraiment rendu un grand service.
J'ai cependant une question. Comment pourrais-je désactiver le petit bandeau d'information sur la première image du slide ?

joe a commenté le 19 Octobre 2006 à 16h:

Nice. However, there should be an option to display the opaque description banner below the image, not on top of it, it only obstructs the photo details.

joe a commenté le 19 Octobre 2006 à 16h:

On devrait avoir l'option d'afficher la description dessous, non sur l'image

Jonathan a commenté le 19 Octobre 2006 à 23h:

Wow, merci pour tout ce bon feedback :)

Alors, pour répondre aux points abordés...

@Grummfy:
Faire un slideshow depuis un repertoire est extremement facile avec un peu de php :) Il suffit de lire les contenu d'un repertoire, sélectionner les images grâce à leur type MIME, puis envoyer tout ca dans une liste JS... (avec pourquoi pas, et c'est recommandé, un petit script qui redimensionne les images lorsque c'est necessaire, il en existe des tout faits).

@valery:
Il suffit de desactiver quelques lignes dans les .js. plus particulierement celles qui sont comme celle-ci:
setTimeout(this.showInfoSlideShow.bind(this),1000);
et
setTimeout(this.hideInfoSlideShow.bind(this),10);
ou
setTimeout(this.hideInfoSlideShow.bind(this),this.slideShowDelay-1000);

Jonathan a commenté le 20 Octobre 2006 à 13h:

Hello,

Just to inform you all that I’ve opened a google group to discuss about issues, improvements or implementations of JonDesign’s SmoothSlideshow:
http://groups.google.com/group/jondesign...

Cheers,
Jonathan

Grummfy a commenté le 20 Octobre 2006 à 14h:

Lol,
je sais mais c'est dommage que ce n'est pas inclus de base ....
enfin étant donné que de base on ne sais pas lister des fichier en js (sauf via xul, xaml ou activx, donc non compatible avec d'autres navigateur)

voila un petit script bien pratique : www.grummfy.com/download/PlusScript/dirt...
c'est sommaire mais est une aide....

pour peux que cela puisse aidé certaine personne ...

Jonathan a commenté le 23 Octobre 2006 à 17h:

@joe:
You can easily do that by changing the css file :)

tambarskjelve a commenté le 31 Octobre 2006 à 12h:

The image title and description does not appear in IE7 on your timed slideshow demo at http://smoothslideshow.jondesign.net/tim...

Ben a commenté le 1 Novembre 2006 à 19h:

Bonjour et bravo

je m'en sers sur la nouvelle version du site du groupe Fleen (www.fleen.net). J'ajoute sur ce site un lien vers le votre.

Ben

Jonathan a commenté le 12 Novembre 2006 à 01h:

@tambarskjelve:
Fixed in the demo, and will be fixed in v2.1 (to be released very soon :))

@Ben:
Ravi de l'apprendre ! :)
J'attends avec impatience de voir la nouvelle version du site !

serge a commenté le 17 Novembre 2006 à 09h:

Bonjour, Après avoir intégré le slideshow V2 sur mon site et visualisé le résultat sous IE6 : Super. Puis, j'ai voulu vérifier sous Firefox : Ne fonctionne pas.
J'ai alors testé le slideshow de demo (sur le site www.jondesign.net) : ne veut pas fonctionner avec les versions courantes de Mozilla, Firefox et Netscape.
La console Java Script des outils de Firefox m'indique : Erreur : previous has no properties dans mootools.release.64.js ; Erreur: fx.Opacity is not a constructor dans showcase.slideshow.js et dans timed.sliseshow.js
Et je ne suis malheureusement pas programmeur ...
Pouvez vous m'aider pour faire fonctionner cet outil très sympa par ailleurs.
Merci.

Jonathan a commenté le 19 Novembre 2006 à 23h:

Bonjour,

J'ai testé dans de nombreuses versions et n'ai jamais eu de problème...

Par contre la version 64 de mootools est connue pour ne pas marcher avec firefox 1.0.7, le problème vient peut être de là.

On va sortir très prochainement la version 2.1 de smoothslideshow, qui devrait regler de problème.

J'espère que ma réponse a pu aider :)

Daniel a commenté le 7 Décembre 2006 à 13h:

Bonjour,
Tout d'abord je tiens à te féliciter pour ton travail qui est vraiment superbe. Toutefois, peux-tu me dires comment je peux faire pour retirer les fleches pour en utiliser en externe? De même,peux tu m'indiquer comment tu as faitpour afficher les infos au dessus de l'image, j'aimerai bien faire pareil pour des images.
Merci par avance pour tes réponses et je tiens encore à te féliciter pour ce travail fabuleux.

messa a commenté le 19 Février 2007 à 16h:

Bonjour,

Votre script est vraiment bien fait... Je débute dans le développement en javascript et j'aurais aimer savoir comment faire pour integrer une variable (en l'occurance un tableeau dans ce cas) PHP dans un script en javascript? Je souhaite reprendre l'idée de 'Grummfy', mais je suis un peu dépourvu...

Merci encore pour ce fabuleux script...

Jerome a commenté le 19 Avril 2007 à 02h:

Très bel effet. Je tente simplement de contrôler le nombre de 'loop' que fait le timed script... sans succès

bob a commenté le 23 Mars 2008 à 01h:

lola a commenté le 23 Mars 2008 à 04h:

kris a commenté le 23 Mars 2008 à 08h:

jenna a commenté le 23 Mars 2008 à 12h:

kris a commenté le 23 Mars 2008 à 15h:

adult a commenté le 23 Mars 2008 à 18h:

jenna a commenté le 23 Mars 2008 à 18h:

mona a commenté le 23 Mars 2008 à 20h:

liza a commenté le 23 Mars 2008 à 22h:

joseph a commenté le 24 Mars 2008 à 01h:

bred a commenté le 24 Mars 2008 à 05h:

joseph a commenté le 24 Mars 2008 à 10h:

kate a commenté le 24 Mars 2008 à 12h:

john a commenté le 24 Mars 2008 à 14h:

john a commenté le 24 Mars 2008 à 15h:

arni a commenté le 24 Mars 2008 à 17h:

sylvia a commenté le 24 Mars 2008 à 17h:

bang a commenté le 24 Mars 2008 à 20h:

dOfatJ great site man thx http://peace.com

bob a commenté le 24 Mars 2008 à 20h:

9SbEo1 hi nice site thx http://peace.com

lola a commenté le 24 Mars 2008 à 22h:

Vernon Alvarez a commenté le 29 Mars 2008 à 22h:

Rockwell, <a href="http://www.freewebtown.com/aeros/amateur-big-tits.html">amateur big tits</a>, [url="http://www.freewebtown.com/aeros/amateur-big-tits.html"]amateur big tits[/url], http://www.freewebtown.com/aeros/amateur... amateur big tits, 9103, <a href="http://xlobo.funpic.de/vintage-lesbian-porn.html">vintage lesbian porn</a>, [url="http://xlobo.funpic.de/vintage-lesbian-porn.html"]vintage lesbian porn[/url], http://xlobo.funpic.de/vintage-lesbian-p... vintage lesbian porn, 56599, <a href="http://members.lycos.co.uk/sqrtmom/mature-piss.html">mature piss</a>, [url="http://members.lycos.co.uk/sqrtmom/mature-piss.html"]mature piss[/url], http://members.lycos.co.uk/sqrtmom/matur... mature piss, 003, <a href="http://elezo.funpic.de/porn-parties.html">porn parties</a>, [url="http://elezo.funpic.de/porn-parties.html"]porn parties[/url], http://elezo.funpic.de/porn-parties.html... porn parties, :-((, <a href="http://elezo.bplaced.net/free-lady-sonia.html">free lady sonia</a>, [url="http://elezo.bplaced.net/free-lady-sonia.html"]free lady sonia[/url], http://elezo.bplaced.net/free-lady-sonia... free lady sonia, :-D, <a href="http://freenet-homepage.de/welezo/candid-teens-in-swimwear.html">Candid Teens in Swimwear</a>, [url="http://freenet-homepage.de/welezo/candid-teens-in-swimwear.html"]Candid Teens in Swimwear[/url], http://freenet-homepage.de/welezo/candid... Candid Teens in Swimwear, >:-PPP, <a href="http://www.freewebtown.com/shmal/sex-toy-movies.html">sex toy movies</a>, [url="http://www.freewebtown.com/shmal/sex-toy-movies.html"]sex toy movies[/url], http://www.freewebtown.com/shmal/sex-toy... sex toy movies, gywk, <a href="http://www.freewebtown.com/aeros/amateur-bikini.html">Amateur Bikini</a>, [url="http://www.freewebtown.com/aeros/amateur-bikini.html"]Amateur Bikini[/url], http://www.freewebtown.com/aeros/amateur... Amateur Bikini, telcf, <a href="http://www.freewebtown.com/shmal/free-hardcore-porn-movies.html">free hardcore porn movies</a>, [url="http://www.freewebtown.com/shmal/free-hardcore-porn-movies.html"]free hardcore porn movies[/url], http://www.freewebtown.com/shmal/free-ha... free hardcore porn movies, >:)), <a href="http://www.freewebtown.com/xlayer/severina-porno-video-free.html">severina porno video free</a>, [url="http://www.freewebtown.com/xlayer/severina-porno-video-free.html"]severina porno video free[/url], http://www.freewebtown.com/xlayer/severi... severina porno video free, 363, <a href="http://members.lycos.co.uk/xlobo/dog-allergy.html">dog allergy</a>, [url="http://members.lycos.co.uk/xlobo/dog-allergy.html"]dog allergy[/url], http://members.lycos.co.uk/xlobo/dog-all... dog allergy, byoz,

Roman Torres a commenté le 1 Avril 2008 à 01h:

Lafayette, <a href="http://freenet-homepage.de/welezo/camp-for-troubled-teens.html">camp for troubled teens</a>, [url="http://freenet-homepage.de/welezo/camp-for-troubled-teens.html"]camp for troubled teens[/url], http://freenet-homepage.de/welezo/camp-f... camp for troubled teens, idks, <a href="http://www.freewebtown.com/shmal/movies-unlimited.html">movies unlimited</a>, [url="http://www.freewebtown.com/shmal/movies-unlimited.html"]movies unlimited[/url], http://www.freewebtown.com/shmal/movies-... movies unlimited, 958651, <a href="http://freenet-homepage.de/shmigas/always-hardcore.html">always hardcore</a>, [url="http://freenet-homepage.de/shmigas/always-hardcore.html"]always hardcore[/url], http://freenet-homepage.de/shmigas/alway... always hardcore, :-[, <a href="http://www.freewebtown.com/xlayer/amateur-clips.html">amateur clips</a>, [url="http://www.freewebtown.com/xlayer/amateur-clips.html"]amateur clips[/url], http://www.freewebtown.com/xlayer/amateu... amateur clips, >:-]], <a href="http://xlobos.bplaced.net/free-ass-to-mouth-movies.html">FREE ASS TO MOUTH MOVIES</a>, [url="http://xlobos.bplaced.net/free-ass-to-mouth-movies.html"]FREE ASS TO MOUTH MOVIES[/url], http://xlobos.bplaced.net/free-ass-to-mo... FREE ASS TO MOUTH MOVIES, 437910, <a href="http://members.lycos.co.uk/shmiga/spring-break-girls-flashing.html">Spring Break Girls Flashing</a>, [url="http://members.lycos.co.uk/shmiga/spring-break-girls-flashing.html"]Spring Break Girls Flashing[/url], http://members.lycos.co.uk/shmiga/spring... Spring Break Girls Flashing, 90029, <a href="http://elezo.bplaced.net/exploited-black-teens.html">exploited black teens</a>, [url="http://elezo.bplaced.net/exploited-black-teens.html"]exploited black teens[/url], http://elezo.bplaced.net/exploited-black... exploited black teens, htoalv, <a href="http://members.lycos.co.uk/xmpeg/tmnt-porn.html">tmnt porn</a>, [url="http://members.lycos.co.uk/xmpeg/tmnt-porn.html"]tmnt porn[/url], http://members.lycos.co.uk/xmpeg/tmnt-po... tmnt porn, %-], <a href="http://elezo.bplaced.net/granny-facial.html">granny facial</a>, [url="http://elezo.bplaced.net/granny-facial.html"]granny facial[/url], http://elezo.bplaced.net/granny-facial.h... granny facial, 075, <a href="http://elezo.ohost.de/nudist-grannies.html">nudist grannies</a>, [url="http://elezo.ohost.de/nudist-grannies.html"]nudist grannies[/url], http://elezo.ohost.de/nudist-grannies.ht... nudist grannies, kbi, <a href="http://members.lycos.co.uk/xmpeg/wwe-lita-porn.html">wwe lita porn</a>, [url="http://members.lycos.co.uk/xmpeg/wwe-lita-porn.html"]wwe lita porn[/url], http://members.lycos.co.uk/xmpeg/wwe-lit... wwe lita porn, %-))),

Postez un commentaire

Derniers Projets

PGO Automobiles Projet de type: Web PlayZikStar Projet de type: Web Holdiland: Boutique en ligne Projet de type: Web

Articles Récents

Paris Envies, Bars et ... Element appartenant à: Blog, Frameworks, Sorties, WebDesign, Web 2.0, TurboGears Découverte : iGoogle Element appartenant à: Blog, Utile, Web 2.0 Smooth Gallery v1.0 Element appartenant à: Blog, Programmation, JavaScript, Sorties, Standards, WebDesign, SmoothGallery Smooth Slideshow v2.1 Element appartenant à: Blog, Programmation, JavaScript, Sorties JonDesign in English just ... Element appartenant à: Blog, Sorties

Nous avons aimés...

Kick & Blog Blog sur les nouvelles technologies et le marketing. Vibleog Le blog des Dailyoutubers. BlogTheCom Blog sur la communication.

Accueil - Ordinateurs haut de gamme - Bar Paris - Articles - Brice - Projets

Switch to English Passez à la version Française Flux RSS des Articles XHtml 1.1 Valide