Me revoilà avec une découverte jQuery, un autre plugin lié à la manipulation d’images. Cette fois, un slide show avec des transitions d’images originales, j’ai beaucoup apprécié les effets.
Vous allez pouvoir avoir sur votre site une galerie d’images avec diverses transitions.
L’utilisation s’effectue ainsi :
On va chercher nos librairies jquery + jqFancyTransitions
On crée notre bloc, qui contiendra notre galerie d’images
Entre les balises head, on insère le javascript qui réalisera le slideshow avec nos éléments
Et le tour est joué !
A savoir qu’il y a plusieurs options disponibles :
effect: '', // wave, zipper, curtain
width: 500, // width of panel
height: 332, // height of panel
strips: 20, // number of strips
delay: 5000, // delay between images in ms
stripDelay: 50, // delay beetwen strips in ms
titleOpacity: 0.7, // opacity of title
titleSpeed: 1000, // speed of title appereance in ms
position: 'alternate', // top, bottom, alternate, curtain
direction: 'fountainAlternate', // left, right, alternate, random, fountain, fountainAlternate
navigation: false // prev and next navigation buttons
links: false // show images as links
width: 500, // width of panel
height: 332, // height of panel
strips: 20, // number of strips
delay: 5000, // delay between images in ms
stripDelay: 50, // delay beetwen strips in ms
titleOpacity: 0.7, // opacity of title
titleSpeed: 1000, // speed of title appereance in ms
position: 'alternate', // top, bottom, alternate, curtain
direction: 'fountainAlternate', // left, right, alternate, random, fountain, fountainAlternate
navigation: false // prev and next navigation buttons
links: false // show images as links
Et depuis la version 1.7, vous pouvez ajouter des urls aux images :
Pour plus d’informations et pour une démo : le site du plugin jqFancyTransitions
Bon code 
[...] This post was mentioned on Twitter by Planete jQuery FR, Ludik Te@m. Ludik Te@m said: jqFancyTransitions – Plugin jQuery – Belles transitions http://bit.ly/b8VnlZ – L'actu ludiBlog [...]
http://application-net.fr/slideshow_jquery.html
Dans le même genre, un slideshow Jquery qui a des transitions avec effets de transparences.
http://application-net.fr/slideshow_jquery.html
[...] jqFancyTransitions – Plugin jQuery – Belles transitions [...]
Bonjour,
Mince, celui-ci m’interesse bien, j’ai suivis tout le codage ici, mais je reste avec mes trois photos les unes a coté des autres. Comprends pas !!
dsl
Bonjour Fantoche,
As-tu bien téléchargé le framework jQuery ??
Oui, j’ai tout vérifier, les appels au librairies Jquery, au script jqFancyTransitions, j’ai resaisis tout les codes et rien, je vois mes images les unes à coté des autres. Dommage, car les effets sont très bien.
[...] Je vous en parle ici Un slide show avec des transitions d’images originales. Le [...]
bon ben moi ca ne fonctionne pas
meme type de pb que fantoche
je suis à la recherche de mon erreur … si qq’un trouve je prends !
merci par avance
sebastien
[...] Je vous en parle ici Un slide show avec des transitions d’images originales. Le [...]
Salut, ça ne fonctionne pas non plus chez moi !!! je ne comprend pas tout est bien insérer la bibliothèque jquery v1.7 le code les options la bibliothèque jqFancyTransitions…..
Sur le site du plugin, ils utilisent une version 1.4.2 de jQuery, certainement que le soucis vient de là. A l’occasion, je tâcherai de regarder ça de plus près…
Bonjour, en fait j’ai trouver le problème, il manque juste le $(document).ready au début comme ceci:
$(document).ready(function(){
$(‘#slideshowHolder’).jqFancyTransitions({ width: 400, height: 300 });
});
oui, en effet merci wajih, j’ai bien entendu copié bêtement le code proposé par le site, parce que pour moi ça coule de source, mais bien évidemment, c’est comme tout plugin jQuery, l’idéal est d’y insérer dans le $(document).ready
Encore merci pour ton retour