Ce petit plugin pour jQuery vous propose d’afficher sous la forme d’un panorama interactif, toutes les images de votre page qui contiennent la classe ’panorama’
Nous avions réalisé il y a quelques temps un plugin permettant l’ajout de panoramas dans SPIP.
L’intérêt de cette nouvelle version, est qu’elle n’est plus uniquement destinée aux utilisteurs du CMS SPIP et surtout qu’elle est basée sur la librairie accessible jQuery, qui permet une intégration plus facile.
Si vous souhaitez aller plus loin et assembler vos vues panoramiques pour former une visite virtuelles, découvrez notre plugin jQuery virtual tour.
Installation
dans la section <head> de votre page, ajoutez :
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.panorama.js"></script>
puis dans le corps de votre page, ajoutez simplement la classe ’panorama’ sur une image panoramique, exemple :
MAJ 06/2009 : Si la taille de l’image n’est pas précisée dans la balise img, c’est la taille réelle de l’image qui est utilisée. Merci à Frédéric Martini pour cette amélioration et pour la gestion du paramètre loop_180.
Vous pouvez personnaliser le style aux couleurs de votre site en modifiant jquery.panorama.css
Options
Il est possible de passer au plugin des paramètres, il faut alors donner à vos images une autre classe que ’panorama’, puis appelez le plugin explicitement en lui passant les paramètres, exemple :
$(document).ready(function(){
$("img.mypanorama").panorama({
viewport_width: 500,
speed: 30000,
direction: 'right',
control_display: 'yes'
});
});
</script>
liste des paramètres :
viewport_width : pour préciser la largeur de la fenêtre de visualisation (par défaut : 600)
speed : permet de contrôler la vitesse de rotation. (Par défaut : 20000)
direction : sens de rotation, ’left’ ou ’right’ (par défaut : ’left’)
control_display : afficher en permanence le panneau de contrôle, valeurs possible : ’auto’ ou ’yes’ (par défaut : ’auto’)
start_position : position au démarrage du panorama. Par exemple 1000 corrspond à x=1000px (par défaut : 0)
auto_start : démarrage automatique du défilement : true ou false (défaut : true)
mode_360 : boucler sur l’image ? true ou false (défaut : true)
MAJ 06/2009 : Un nouveau paramètre loop_180 (prend les valeurs true ou false) permet de boucler sur des gauche/droite lorsque mode_360=false.
Téléchargement
Ce logiciel est libre sous licence GNU GPL.
Le 8 avril 2008
22 Messages
6 décembre 2012, 09:50, par Michel Puissant
Bonjour,
J’ai expérimenté le viewer 360 et vous remercie pour cette option de viewer que je recherchai depuis très longtemps, j’aimerai savoir s’il serait possible de paramétrer plusieurs vitesses de défilement pour un grand pano à la manière de
http://www.alpen-panoramen.de/viewer.php?pid=21429
Merci d’avance pour votre réponse
Michel Puissant
2 novembre 2012, 12:43, par mimmo
hi. thanks for plugin.
is there a param "end_position" for blockin the scroll at end of image (i use an image 180° and i want to stop the scroll at end) ?
anyone can help me ?
thank a lot
27 septembre 2012, 16:06, par dargone
Bonjour,
Est-ce possible de modifier les options par exemple speed à l’aide d’un Slider (Jquery UI) sans que le plugin recrée un nouveau panorama ?
Exemple :
$(’.pano’).panorama(mes options de base) ;
$(’.slider).slider(change : function(ev, ui) $(’.pano’.panoramaspeed : ui.value) ;) ;
Merci
29 août 2012, 20:41, par Marino
Very nice, very easy to implement. Is it possible to make it full screen ?
3 mai 2012, 13:39, par Franz Fiala
J’ai trouvé "loop_180" ici :
http://piwigo.org/dev/browser/extensions/Panoramas/js/jquery.panorama.js?rev=6527
C’est une modification par Frédéric Martini.
Franz
6 mars 2012, 17:35, par Estragon
Bonjour,
Ce Plugin est carrément sympa, merci bien !!!
Par contre je n’arrive pas a utiliser le loop_180, a dire vrais je ne trouve aucune trace de cette fonction dans le .js, pouvez vous m’aider svp .
Merci d’avance
cordialement
23 juin 2011, 01:15
Hi,
I just wanted to let you know, that we added your simple panorama viewer in our webpage at http://www.uvitalonghouse.com/longhouse-panorama.php
Thanks a lot and greetings from Costa Rica !
5 février 2011, 19:15, par NIK
HELLO
BEFORE ANYTHING THANKS A LOT FOR YOUR USEFUL SCRIPTS
in the "jQuery simple panorama viewer", how can i put a small picture at the center of panorama as logo ?(i want to add a code in the "jquery.panorama.js")
22 novembre 2010, 11:36, par dimelot
Je souhaite publier des panoramas non 360 sur mon site. J’ai donc mis le parametre mode_360 à false. Je remarque cependant que l’image stoppe pendant un moment peu avant la fin puis repart. Ca me le fait quelque soit le panorama utilisé.
Par ailleur une fois arrivé à la fin, l’image ne repart pas vers la gauche. J’ai regardé le code du jquery.panorama.js du 25/06/2010, je ne vois pas le parametre loop_180 dont vous parlez. Pouvez vous m’aider ? Cordialement
18 novembre 2010, 16:02, par Walter
Buenos días, desde Colombia
Excelente aporte, muy fácil de implementar.
Muchas Gracias..
28 juin 2010, 09:11, par Arnault Pachot
corrigé, merci !
++
25 juin 2010, 18:26, par squirrel
Pour ce qui voudrais vraiment télécharger le zip, car en date du 25 juin 2010 à 18h24 le lien de téléchargement ne fonctionne pas :)
Voici le bon lien
http://www.openstudio.fr/download/jquery.panorama.zip
squirrel :)
14 juin 2010, 19:29, par VDigital
Pour info votre plugin est intégrer dans le plugin Panoramas de la galerie Piwigo.
http://fr.piwigo.org/ext/extension_view.php?eid=207
Merci
10 juin 2010, 05:30
Hi
Great plugin.
I was wondering if you have extended this with jquery mousewheel plugin as I have tried and cant quite get it to work
thanks.
9 juin 2010, 01:38, par Laurent
Bonjour formidable plugin. J’aimerais savoir une chose :
Est-il possible d’utiliser ce plugin pour un panorama "vertical" ? Donc même principe mais de bas en haut et qui ne va pas jusqu’à 360° (ça s’arrete à 180 environ).
Merci !
11 mai 2010, 13:56
merci pour ce plugin très esthétique et facile à utiliser. Une question : je n’arrive pas à regler la vitesse de défilement , comment faire ?
merci d’avance.
le co-xebmaster du site du Lycée
Voir en ligne : site du lycee A Camus de Rillieux La Pape
24 novembre 2009, 17:52, par alain
Juste une question : je voudrais simplement enrichir l’interface de deux choses :
mais je ne sais pas trop où intervenir dans le code
pourriez vous m’aider ?
mon mail : soulou@free.fr
23 septembre 2009, 11:22, par jimmy
Bonjour
En premier lieu, merci et bravo pour ce viewer exeptionnel.
Je l’ai testé avec succès étant pourtant débutant en CSS & cie.
J’ai cependant une petit question concernant les "options"
Où placer ce code afin de ne pas présenter les photos en 360° mais en les stoppant aux extrémités ?
Merci par avance
Cordialement
31 août 2009, 12:39
Ce petit plugin pour jQuery vous propose d’afficher sous la forme d’un panorama interactif, toutes les images de votre page qui contiennent la classe ’panorama’
5 août 2009, 18:55, par Laurent
Bonjour, j’ai trouvé ce plugin très intéressant et le teste actuellement sur mon blog. Je rencontre encore quelques difficultés : le panel de commandes " boutons de commande quasi invisibles sur le background transparent", je ne sais où et comment modifier la hauteur du titre vertical, l’applet thickbox ne s’affiche à l’appel d’une url. Pourriez-vous me guider ? Merci.
4 mars 2009, 00:40, par cana
Très sympa ce Plugin ! Facile à utiliser si on a un minimum de connaissance en HTML/CSS et JavaScript. De plus il est sous licence GNU GPL ce qui est rare dans le domaine d’une visite virtuel. Je recommande aussi SpinControl:VR et PanoSalado qui utilise Flash/CS3. Ces outils sont gratuits et disposent d’un support documentaire très compréhensible ainsi que d’une aide en ligne.
Bon encouragement et encore merci pour ce Plugin
Voir en ligne : http://panosalado.com/
4 juillet 2008, 13:42, par Guillaume
Bonjour,
Merci pour ce Plugin qui est très sympathique !
Je ne l’ai pas beaucoup utilisé mais je l’ai adopté après le peu que j’en ai vu.
Plus besoin de se casser la tête pour des visites panoramiques.
Bonne continuation.