[Résolu] Un brin de FLASH ou du Javascript pour un panorama ?

Bonjour à tous,

je cherche actuellement à réaliser un diaporama (regroupant différentes photos) avec défilement horizontal, quelque chose dans ce genre...

Exemple 1
Exemple 2

Ceux-ci sont en flash, mais ils en existe aussi des séries en javascript, c'est juste pour avoir une idée, car je souhaite que cela s'intègre dans une charte graphique bien précise.

J'aimerais vos conseils sur le sujet, car je souhaiterais quelque chose :
- qui s'intègre entièrement à ma charte graphique (prédéfini mais personnalisable à souhait ? création de A à Z ?)
- qui me permettent de mettre des liens sur chaque photos
- où je puisse intégrer un sous-titre sur ou en dessous la photo
- qui se mettent à jour facilement ou au moins sans batailler
- qui soit pratique pour stocker et défiler environ entre 30 et 90 photos


Je n'ai aucun code sous le bras en FLASH ou en Javascript, et je ne sais pas quelle méthode choisir pour être le plus efficace et en même temps le plus lisible pour les visiteurs.

Qu'en pensez-vous ? Quelle plateforme choisir ? Vous avez vos codes favoris dans le genre "panorama de photos horizontal avec liens" ? Des conseils à me donner ?


Merci ! Cordialement,
Modifié par termi (17 Jul 2008 - 13:26)

Bonjour,
Pour le premier exemple que tu as donné, il existe différent type de carrousel javascript comme celui ci http://sorgalla.com/jcarousel/.
Il en existe plusieurs sortent avec les prinicplales librairies js, jQuery, Mootools ou Prototype.

Pour le deuxième exemple, le fameux coverflow de Itune, c'est uniquement faisable avec flash. Tu en as un gratuit ici http://www.n99creations.com/vieweg.php?id=5 (fourni avec le .fl donc complètement modifiable) ou ici http://www.yaelle.com/?p=55 (uniquement le swf).Je les ai essayé à une occasion ça marche bien, même si ça prend pas mal de CPU.
Modifié par matmat (09 Jul 2008 - 02:24)

Bien, sinon concrètement, pour aider notre ami termi, je suis l'auteur de PictureFlow, le Coverflow en flash mentionné par matmat ci-avant (Vous savez sur y_____.com (Je ne met pas le lien en clair ou l'on va encore m'accuser de spammer et ça, c'est moche )).

Donc [mode PUB = ON]:
PictureFlow est GRATUIT
PictureFlow a un mode automatique
PictureFlow est complètement parametrable via un fichier XML (Pas de FLA)
PictureFlow n'occuppe pas plus de 50% de CPU sur un PC récent et encore moins sur un MAC
[mode PUB = OFF]

Salut osamwal!

Il est super ton script. Pour le CPU, c'était pas un critique de ton script, je sais que l'effet dans tout les cas demande pas mal de calcul. Mais c'est vrai que en comparaison avec l'autre lien que j'ai mentionné il consomme moins de CPU ( l'autre peut faire monter à 60/70 % ).

Salut osamwal, merci beaucoup pour ton conseil...

Je suis vraiment fan de ce Coverflow, graphiquement parlant, mais y'a un point qui me pose un gros problème que je ne sais pas résoudre :

- J'aimerais que chaque photo redirige les visiteurs vers une page différente quand on clique dessus (Soit quand on clique sur la photo, soit quand on clique sur les détails "Selected")

Est-ce que celà est possible de paramètrer ça ?? Car je ne suis pas un as en actionscript, j'ai simplement vu un bloc "http" dans le XML avec "/artwork" mais je ne sais pas trop quoi bidouiller pour pouvoir mettre un lien sur le "Selected" ou mieux sur les photos...

Et même si je n'ai pas encore testé le caroussel, vu sa tournure et connaissant un peu le javascript, je me doute que ça doit être possible de faire ça. Maintenant est-ce possible sur le Coverflow de l'adapter avec un lien ??
Modifié par termi (10 Jul 2008 - 01:08)

Salut terni,
Tu confonds avec celui de n99, le miens est Là : http://www.yaelle.com/?p=72
Télécharges le package sur le site. Il y a un mode d'emploi et des exemples à l'intérieur qui expliquent ce que tu veux faire.

Ah excuses-moi, oui je viens de regarder, celui-ci est beaucoup plus complet ! Vraiment du magnifique travail !

Par contre, je suis toujours embêter avec mon problème de liens sur les images. J'ai vu dans le tutoriel fourni dans le zip qu'il fallait mettre l'URL de destination dans le code "action" du XML, mais j'ai beau mettre une adresse web, rien ne se passe quand on clique. Est-ce qu'il faut désactiver ou activer une fonction (java,shadowbox, autre ?) quelque part ??


Merci encore pour ton (& votre) aide !

Attention, l'ouverture de liens via Javascript par Flash est bloquée en test local pour des raisons de sécurité liées au Player. Pour que ça marche normalement il faut tester sur un vrai serveur en ligne ou autoriser le répertoire dans les paramètres de sécurité du player. Cela peut se faire en ligne ici : http://www.macromedia.com/support/documentation/fr/flashplayer/help/settings_manager04.html#117502
Modifié par osamwal (10 Jul 2008 - 11:09)

Oui, j'ai bien testé sur serveur web. En fait dans le XML :

- Si je met cette ligne de code, pour ouvrir une URL (ex: Google) dans la même page et en pleine page, ça ne marche pas !

<icon image="pictures/doudou/thumbs/cham_spring.jpg" target="_self" action="http://www.google.fr"  titre="CHAMINOU" desc="ZZZZZZZ"/>

- Si je met cette ligne de code, en rajoutant l'option Shadowbox, j'ai mon URL (ex: Google) qui s'ouvre dans le shadowbox sur la même page mais avec cette frame shadobow qui contient la page sur fond noir !

<icon image="pictures/doudou/thumbs/cham_spring.jpg" action="http://www.google.fr" rel="shadowbox[gallery];options={counterType:'skip',continuous:true,handleLgImages:'drag'}" titre="CHAMINOU" desc="Draggable Image"/>

Ce que je souhaiterais c'est uniquement une URL classique, qui redirige vers une page différente quand on clique sur la photo... J'ai peut-être mal fait quelque chose ??


Sinon dans les flashVars, comment faire pour rajouter une image en background du fichier Flash ?? J'ai vu qu'il y avait des lignes spécifiques mais ça n'a pas l'air évident de faire tout concorder...
Modifié par termi (10 Jul 2008 - 12:44)

Je viens de tester en rajoutant le flashVars avec "lightBox=false" et le shadowbox est bien désactivé, mais par contre les URL classique ne marche toujours pas. Aucune redirection vers les différentes pages quand on clique sur les photos.

Code rajouté sur le flashVars

<script type="text/javascript">
	var flashVars="";
	flashVars+="lightBox=false";
etc...

Code dans le XML

<icon image="pictures/doudou/thumbs/cham_spring.jpg" target="_self" action="http://www.google.fr"  titre="CHAMINOU" desc="ZZZZZZZ"/>
etc...

Je ne vois pas ce qui cloche... Pourquoi l'URL n'est pas active ? Aurais-tu une idée ?


Merci beaucoup ! Cordialement,

Envoie moi l'URL STP pour analyser (En MP si Top Secret)

Merci beaucoup, je viens de comprendre pourquoi il y avait ces différe,tes hauteurs, je pensais que c'était juste des exemples prédéfinis. Merci encore !

Par contre j'ai cru constater que le XML n'acceptait pas les accents (é, è, etc...) et autres caractères spéciaux, c'est encore moi qui fait une erreur quelque part ou cette fois j'ai bon ?? Y'a-t-il un moyen de mettre malgré tout des accents ??