Vous ne trouvez pas de réponse à votre problème ? Alors posez la question dans le forum. Souvenez-vous qu'il n'y a jamais de question bête, mais rester dans l'ignorance parce que l'on n'ose pas poser une question, ça c'est une erreur !

GALERIE PHOTO AVEC MENU RUBAN


Information sur la source

Catégorie :Graphique Classé sous : galerie, photo, ruban, ajax, xml Niveau : Débutant Date de création : 17/10/2007 Date de mise à jour : 17/10/2007 19:52:13 Vu / téléchargé: 20 090 / 2 238

Note :
9 / 10 - par 3 personnes
9,00 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10

Commentaire sur cette source (28)
Ajouter un commentaire et/ou une note


Description

Cliquez pour voir la capture en taille normale
Firefox – IE – Safari

Démo ici :
http://www.jean-mi.com/JMGalerie

Galerie fonctionnant avec la librairie de "The Rubik's Man" et inspirée de scripts trouvés sur le Web (voir liens dans la conclusion).

* Fichier XML à préparer (files/galerie.xml)
Insérez le nombre d'albums et de photos que vous souhaitez sur le même modèle que l'exemple :
<album id= « [ID de l'album] »>
  <photo title= « [Titre de la photo] » src= « files/[Nom de l'image] » />
</album>

* Dossier à organiser (files/)
Insérez vos images dans le dossier « files ».
Les images grand format ont pour début de nom de fichier « files/gd_[Nom de l'image] » tandis que les miniatures ont pour début de nom de fichier « files/[Nom de l'image] ».
[Nom de l'image] doit etre identique pour les deux formats.
Aussi c'est le nom des miniatures « files/[Nom de l'image] » qui doivent figurer dans le fichier XML (« src » des photos).
[Nom de l'image] peux contenir des noms de dossiers/sous-dossiers (comme dans l'exemple : le dossier « macbookpro »).

* Paramètres de la fonction
Le premier indique l'ID de l'album présent dans le fichier XML (<album id= «[ID de l'album]»>)
Le second indique la première image sélectionnée (ex : 3)
 

Source

  • <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  • <html xmlns="http://www.w3.org/1999/xhtml">
  • <head>
  • <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  • <title>JMGalerie</title>
  • <link rel="stylesheet" href="JMpack/JMGalerie_styles.css" type="text/css" />
  • <script type="text/javascript" src="JMpack/therubiksman_lib.js"></script>
  • <script type="text/javascript" src="JMpack/JMGalerie.js"></script>
  • </head>
  • <body>
  • <div id="JMgalerie">
  • <p>Votre navigateur ne peux pas afficher ce diaporama.<br />Pour palier &agrave; ce probl&egrave;me, vous devez activer le JavaScript dans les options de votre navigateur.</p>
  • </div>
  • <script language="javascript">
  • window.onload = JMGalerie("macbookpro", 1);
  • </script>
  • </body>
  • </html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>JMGalerie</title>

<link rel="stylesheet" href="JMpack/JMGalerie_styles.css" type="text/css" />
<script type="text/javascript" src="JMpack/therubiksman_lib.js"></script>
<script type="text/javascript" src="JMpack/JMGalerie.js"></script>
	
</head>
<body>

	
<div id="JMgalerie">

	<p>Votre navigateur ne peux pas afficher ce diaporama.<br />Pour palier &agrave; ce probl&egrave;me, vous devez activer le JavaScript dans les options de votre navigateur.</p>
	
</div>


<script language="javascript">

	window.onload = JMGalerie("macbookpro", 1);

</script>
	
	
	
</body>
</html>

Conclusion

The Rub's Man Librairie
http://www.javascriptfr.com/codes/AJAX-LIBRAIRIE-SIMPLIFIEE-PERMETTANT-LIGNE-FAIRE-REQUETES_39686.aspx


///////////////////////////////////////

Ce script est amené à etre amélioré
N'hésitez pas à poster vos commentaires

///////////////////////////////////////
 

Fichier Zip

Pour les "Membres Club", vous pouvez télécharger directement un fichier contenu dans le zip sans télécharger le zip en entier !

Télécharger le zip

Historique

17 octobre 2007 19:52:14 :
// Ajout d'une démo

Commentaires et avis

signaler à un administrateur
Commentaire de valvasev le 18/10/2007 15:02:23

Très beau Galerie, pas ancore essayer en local, mais vu par le Demo c'est Bom! sans compter que dans les couleurs il fait vraiment pour moi..pour le code ça na pas d'importance ci queslches chose né pas en conformité l'important e que se sois fonctionelle.
excuser non français, m'ais je suis italien. je m'arrange come je peu. les fautes sont pour moi une option.

signaler à un administrateur
Commentaire de metis15 le 19/10/2007 10:25:23

Bah, dans IE6, ça marche pas bien : les images du ruban se couvrent aléatoirement de pavés gris (clairs, foncés...).
Dans FireFox, ça marche bien.

Accessoirement, cette fenêtre de CodeSource Javascript s'ouvre à deux fois la largeur de l'écran avec IE6 mais pas avec FF...
Les retour à la ligne ne se font pas dans le texte. C'est p'tèt mon IE qui déconne ?
Ca le fait pas ailleurs en tout cas.

signaler à un administrateur
Commentaire de bj33 le 22/10/2007 12:33:44

salut

impossible de l'executer en local.erreur 0 avec opera et firefox et acces refusé avec ie6/7.

la démo en ligne génére une erreur à l'ouverture avec ie6/7, fonction non implémentée.

signaler à un administrateur
Commentaire de JeMi le 22/10/2007 12:50:03

Merci pour vos commentaires
Le script tel quel n'est pas fait pour etre exécuté en local, il faut faire une modification dans la librairie "the rubik's man" (cela doit etre expliqué dans le lien de cette librairie). J'ajouterais une petite documentation pour l'indiquer.
Pour le bug fonction non implémentée et les pavés gris, j'ai dû faire quelques petits oublis, toutes mes excuses !

signaler à un administrateur
Commentaire de jtoto le 28/10/2007 15:17:18

bonjour,
La démonstration est très bien mais il est dommage que cela ne fonctionne pas en local.
Autrement ça vaut 10/10

signaler à un administrateur
Commentaire de cocoflamenco le 22/11/2007 18:29:31

Bonjour, quelle modification faut il faire dans la librairy pour que le script fonctionne en local? j ai un message d erreur 0 kan quand je l ouvre...
Merci , si cela fonctionne la gallerie est sympas...

signaler à un administrateur
Commentaire de helenepat le 03/12/2007 19:58:16

Bien le bonjour, j'ai téléchargé la librairie et modifié tous les noms JM et ce, dans tous les dossiers .js etc. j'ai envoyé le tout dans mon domaine ... mais la seule chose qui fonctionne, c'est le nojavascript ! n'étant pas une pro en la matière, j'ai pas pris de chance j'ai même copié les .DS_Store.

Y a quelque chose que je dois faire? ou corriger?

Merci de m'aider.

signaler à un administrateur
Commentaire de alea31 le 18/12/2007 16:44:51

Bonjour,

je suis ultra débutante en création de site web (cf. mon site: www.reves-de-fee.com) et je souhaite créer exactement sur un site ce que avait réalisé. J'ai téléchargé le zip mais je vois dans les commentaires que le script n epeut être exécuté en local. Etant donner mon niveau, je ne sais comment procéder. De plus, vous parler d'une librairie "the rubik's man", ou se trouve-t-elle ? Aidez moi s'il vous plaît je galère !!!

Merci par avance, Aléa31

signaler à un administrateur
Commentaire de valvasev le 18/12/2007 20:57:08

à moi le script fonctionne sur firefox e sur IE.7, meme en local il suffit de l'ouvrir avec Easy-php

signaler à un administrateur
Commentaire de JeMi le 19/12/2007 05:55:17

Petites précisions...

*** Pour que la galerie fonctionne en local : A vrai dire je ne sais pas ce qu'il faut modifier dans la librairie et si cela est finalement possible ! Je pensais qu'il y avait une ou deux parties à modifier, mais j'ai peut-être confondu avec une autre librairie.

*** Si après modification des mots-cles "JM", "JMPack", "JMGalerie", etc. la galerie ne fonctionne plus... c'est que vous avez dû faire une erreur ou un oubli quelque part ! Le script n'ayant pas été écrit pour être lu clairement, il y a de fortes chances que vous ayez un peu de mal à faire cette manipulation.

*** La librairie de "the rubik's man" est intégrée avec le script. Pas besoin d'aller la trouver quelque part. Sinon, on peux la trouver à partir du lien cité dans la conclusion (juste en dessous de la source sur cette page).

Bonnes fêtes à tous !
Jean-Michel

signaler à un administrateur
Commentaire de patrick974 le 30/12/2007 17:24:33 10/10

Bonjour,
tout fonctionne pour moi :) .
Merci pour cette exellente source.
Au revoir.

signaler à un administrateur
Commentaire de magmach le 14/01/2008 14:21:21

Bonjour,

ce script m'intéresse mais il est incompréhensible à appliquer pour une personne débutante, je suis déçue car je patoge total !

signaler à un administrateur
Commentaire de beejeridou le 07/02/2008 23:11:45

Génial! ca marche pour moi en local avec easy php. J'ai testé sur Ie 7 Fire fox et Opéra, et ce dernier interprète mal la galerie. C'est le seul point noir!
Merci pour cette source très instructive pour moi ^^

signaler à un administrateur
Commentaire de Lennemi le 27/02/2008 13:43:47

Bonjour, j'ai un problème avec ton script. Sur IE... #1 Sur Firefox... #1. Cependant, quand j'applique l'album au centre de ma page... il y a un bug avec Firefox. Le problème est le défilement des miniatures qui est en dehors des limites. C'est a dire que la bande de miniature se met a defiler environ 2-300 pixel AVANT l'album et se termine 2-300 pixel AVANT la fin de la bande... J'ai tenter de changer des chiffres dans la fonction suivante

var fadeAll = function(type, objName, indice, total) {
...
}

Ca change des choses mais pas comme je le veux... et le code n'étant pas documenter se présente difficile à manipuler.

Comment règler ce problème ?

Merci !

signaler à un administrateur
Commentaire de Lennemi le 05/03/2008 18:39:36

J'ai mit la main sur ce qui causait problème...
Dans JMGalerie.js a la ligne suivante :
document.getElementById('JMxmin').innerHTML = document.getElementById("JMnavigateur").offsetLeft + 100;

J'ai changé la valeur pour 250... et le ruban se déroule tres bien dans Firefox, sauf que ca change des chose pour IE... pour linstant je me suis fait une patch qui détecte quel navigateur l'utilisateur utilise... mais il serait bien de voir ce qui cause problème dans cette ligne pour pouvoir faire un code propre et augmenter la compatibilité du script.

Tiens moi au courant
a+

signaler à un administrateur
Commentaire de cejeg3012 le 28/04/2008 15:43:12

au secours
j'ai utilisée ce script pour le site d'un client (www.alufen.ch)
ça ne marche plus
j'ai l'animation d'attente mais rien d'autres
les photos ne se chargent jamais
aidez moi c'est urgent
merci beaucoup
céline

signaler à un administrateur
Commentaire de nickadele le 28/04/2008 15:48:23 administrateur CS

Bonjour,
peut-être vérifier que le fichier xml est au bon endroit !
Si oui, vérifier que les images sont au bon endroit !

signaler à un administrateur
Commentaire de cejeg3012 le 28/04/2008 16:03:58

j'ai tout vérifiée par rapport au code d'origine, tout est bon
d'autant plus que ça fonctionné, et que j'ai juste modifiée des photos !

signaler à un administrateur
Commentaire de nickadele le 28/04/2008 17:12:10 administrateur CS 10/10

Vide le cache de ton browser et faire un refresh de la page !

signaler à un administrateur
Commentaire de cejeg3012 le 28/04/2008 17:57:34

c'est fait egalement. j'ai testée sur plusieurs poste, ainsi que mozilla et IE

signaler à un administrateur
Commentaire de nickadele le 28/04/2008 18:44:15 administrateur CS

Re, peux-tu donner l'url du site ici ou en MP.

signaler à un administrateur
Commentaire de nickadele le 28/04/2008 19:17:04 administrateur CS

Re,
je viens de voir que l'url était inscrite ci-dessus !
J'ai regardé la source fenetre.htm, il y a une inversion entre l'appel du script et la définition l'album.
<td width="597" valign="top">
<p align="left">
  <script type="text/javascript">
   window.onload = JMGalerie("fenetre", 1);
  </script>
</p>
</p>
<div id="JMgalerie">
<p align="center">&nbsp;</p>
<p align="center">Votre navigateur ne peux pas afficher ce diaporama.<br />
Pour palier &agrave; ce probl&egrave;me, vous devez activer le JavaScript dans les  options de votre navigateur.</p>
</div>
<script type="text/javascript">
window.onload = JMGalerie("garages", 1);
</script>
<p align="center">&nbsp;</p></td>

En plus tu as 2 * JMGalerie, 1* garage et 1*fenetre.
Le bon code :
<td width="597" valign="top">
<p align="left">
  <div id="JMgalerie">
   <p align="center">&nbsp;</p>
   <p align="center">Votre navigateur ne peux pas afficher ce diaporama.<br />
                      Pour palier &agrave; ce probl&egrave;me, vous devez activer le JavaScript dans les options de votre navigateur.</p>
   </div>
  </p>
</td>

signaler à un administrateur
Commentaire de nickadele le 28/04/2008 19:20:06 administrateur CS

Voici le bon code :

<td width="597" valign="top">
<p align="left">
  <div id="JMgalerie">
   <p align="center">&nbsp;</p>
   <p align="center">Votre navigateur ne peux pas afficher ce diaporama.<br />
                      Pour palier &agrave; ce probl&egrave;me, vous devez activer le JavaScript dans les options de votre navigateur.</p>
  </div>
<script type="text/javascript">
window.onload = JMGalerie("fenetre", 1);
</script>
</p>
</td>

signaler à un administrateur
Commentaire de ctzenfr le 04/05/2008 15:43:09 7/10

Bonjour,

-> JeMi
Il est top ton script, merci beaucoup.
Tout est OK sous PC XP2 avec IE6, IE7 et FF2 en local sous WAMP et sur serveur mutualisé (infomaniak).
Par contre pas avec Opera 9.25 (Option javascript activée mais pas java), ni en local ni sur le serveur et depuis plusieurs postes.
Le diaporama s'affiche, la première photo également, les miniatures aussi, le défilement horizontal fonctionne mais pas les liens des miniatures et le le texte du lien s'inscrit dessus 'MacBook Pro 15 - Photo 1\";'
Pourtant la barre d'adresse du navigateur prends bien les clicks #al-macbookpro_el-1 2 3...
L'alerte d'activation javascript s'inscrit également 'en vrac' juste sous le miniatures.

-> cejeg3012
Ce pb est présent sur le site que tu as développé www.alufen.ch.
Les diapos de leurs gammes de produits ne fonctionnent pas sous Opera !!!

Cherché mais sans résultat débutant en js :-(  
Si quelqu'un a une piste ?

signaler à un administrateur
Commentaire de cejeg3012 le 08/05/2008 11:06:29

merci merci beaucoup nickadele
tout refonctionne
tu es un génie

signaler à un administrateur
Commentaire de nickadele le 08/05/2008 15:34:42 administrateur CS

tu es un génie  >> attention t'as épuisé ton stock de voeux ;o)

signaler à un administrateur
Commentaire de bartsword1234 le 10/07/2008 14:25:49

Bonjour, je n'arrive pas à télécharger le zip. Voici le message d'erreur qui m'est retourné :

IWSS Security Event (PROXYTST2)
InterScan Web Security detected the following in HTTP traffic:

Item: http://www.javascriptfr.com/dlzip.zipnix?ID=44416&accept=1
Action: deleted
Reason: Violation of a compressed file restriction

-- File: dlzip.zipnix?ID=44416&accept=1, security warning: Compressed_Huge_File
The uncleanable file is deleted.

Merci pour l'aide.

PS: je suis logué évidement...

signaler à un administrateur
Commentaire de nickadele le 10/07/2008 15:53:22 administrateur CS

C'est un problème lié à ton firewall !

Ajouter un commentaire

Discussions en rapport avec ce code source dans le forum

Galerie Photo demande conseil [ par G4uthier ] Bonjour, voila j'ai une partie admin pour gérer une galerie photo et je voudrais que quand ladmin clique sur la photo et bien la photo se supprime de creation galerie photo [ par sebplan ] bonjour à toutes et à tous, je viens de franchir le grand pas de m'inscrire je suis un débutant, depuis 2 mois j'essaie de créer un site internet déd Navigation clavier dans une galerie pour passer d'une image à l'autre [ par zorkzyd ] Bonjour à tous, J'ai créé un code pour ma galerie pour passer d'une image à l'autre avec les flèches du clavier mais ça ne marche pas... pouvez-vous galerie photo, help ! [ par leojou ] Bonjour, voici les premières ébauches d'une galerie photo avec boutons suivant/précédents et vignettes miniatures : http://leojou.ifrance.com/ il y menu ruban avec vignette [ par pule ] bonjour a tous j'ai trouvé un script tous simple pour faire une galerie mais le probleme est que les miniatures ne s'affiche pas en menu ruban mais s' galerie photo [ par maxxou56 ] Je souhaiterais réalisé un site internet avec une galerie photo, mais je suis un peu bloquer sur le code étant donné que je nai que très peu de basees Soucis avec galerie photo [ par Vivi82 ] Salut à tous,Comme je m'y connais pas vraiment en javascript , j'aimerai bien un ptit coup main, si possible J'ai comme qui dirait un ptit soucis avec galerie photo mysql [ par nissweb ] Bonjour j'ai besoin un code qui pemet d' ajouter et suprimer des photo à partir d'un formulaire  qui contiens discription; style de photo et parcurir "ajax" et probléme de rafraichissement [ par matheo54 ] Bonjour a tous ( ou bonsoir )Je vous souhaite pour commencer a tous et a toutes une bonne et heureuse année 2007.Ensuite, j'aurais un ti conseil à vou


Nos sponsors

Sondage...

CalendriCode

Octobre 2008
LMMJVSD
  12345
6789101112
13141516171819
20212223242526
2728293031  

Consulter la suite du CalendriCode

Téléchargements

Logiciels à télécharger sur le même thème :



Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel BAÏSE, Merci à Vincent pour ses précieux conseils
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés
Temps d'éxécution de la page : 0,343 sec

Google Coop CodeS-SourceS Google Coop CodeS-SourceS