S'identifier - S'inscrire - Ecrire un article - Contact

implémentation jdgallery

pour une belle gallerie d'images

Par bml • Aide • Mardi 09/03/2010 • 11 commentaires  • Lu 4422 fois • Version imprimable

Mots-clés :

Bonjour,

J'ai essayé d'instaler le script jdgallery  de jondesign's (il me semble que c'est celui utilisé) afin d'obtenir un "slideshow" qui ressemblerait à la rubrique "en images" de la page d'accueil du site "vie de viabloga".

J'aimerais l' installer dans un bloc ou un article. Est-ce possible?

J'ai copié

<script src="files/mootools.v1.11.js" type="text/javascript"></script> <script src="files/jd.gallery.js" type="text/javascript"></script>
<link rel="stylesheet" href="files/jd.gallery.css" type="text/css" media="screen" />

dans mon header

et j'ai créé un article avec le div myGallery dans la source, puis

<script type="text/javascript">
function startGallery() {
var myGallery = new gallery($('myGallery'), {
timed: true
});
}
window.addEvent('domready', startGallery);
</script>

tout comme indiqué sur le site de Jon.

Mais ça ne marche pas. Je bloque. Quelqu'un peut-il m'aider?

Merci d'avance à tous et bonne fin de journée.


Commentaires

par Stephane le Mardi 09/03/2010 à 20:43

Stephane Peux tu nous donner l'adresse d'une page où tu as mis le script ?
Il n'y a pas d'erreurs dans la console javascript ? (menu outils)

| [^] | Répondre
Re: par thierry le Mercredi 10/03/2010 à 09:32

bonjour,

J'ai essayé de créer un bloc HTML appelé "galerie" avec quelques images qui apparraissent bien mais pas du tout affichée avec le script...

il se trouve là :http://atelierlorient.viabloga.com/    tout en bas colonne de gauche.

Je ne vois pas la console javascript dans le menu outils.

Peut-être les fichiers js et css ci-dessous ne sont pas au bon endroit? Ou le code?

<script src="files/mootools.v1.11.js" type="text/javascript"></script> <script src="files/jd.gallery.js" type="text/javascript"></script>
<link rel="stylesheet" href="files/jd.gallery.css" type="text/css" media="screen" />

Merci de ton aide.

| [^] | Répondre
Re: par Stephane le Mercredi 10/03/2010 à 10:12

Stephane Les lignes ne sont pas au bon endroit, là elles sont dans un bloc <style ..> .. </style>, du coup elles sont ignorées. Il faut les mettre juste avant <body>

| [^] | Répondre
Re: par thierry le Mercredi 10/03/2010 à 11:34

merci.
Effectivement.
Mais rien ne se passe...
Peut-être faut-il créer un dossier spécial pour les js et css? Mais je crois qu'on ne peut pas gérer les dossiers et sous dossiers...
Peut-être qu'i le me manque des fichiers...je n'ai pas tout uploadé le contenu des zip de jon

J'ai un peu de mal sur ce coup là!


| [^] | Répondre
Re: par Stephane le Mercredi 10/03/2010 à 11:55

Stephane Je me suis trompé, c'est juste avant le </head> au lieu du <body>.

| [^] | Répondre
Re: par thierry le Mercredi 10/03/2010 à 14:34

ok.

Je pense que cela ne fonctionne pas car je n'ai pas uploadé toutes les ressources du scripts et pas aux bos endroits.

Comment peut-on gérer l'arborescence des dossiers et sous-dossiers?


Par exemple j'ai créé un dossiers script en passant par fck/parcourir le serveur et j'y ai mis les éléments js.

J'ai créé un dossier css et j'y ai mis les éléments css mais je n'arrive pas à uploadé les images dans le sous-dossier img. >Les images doivent impérativement aller dans le dossier images?
je peux modifier le fichier css mais pas les fichiers js.


Y a-t-il une petite fiche sur la gestion des dossiers?

Merci encore.

| [^] | Répondre
Re: par Stephane le Mercredi 10/03/2010 à 16:22

Stephane Il vaut mieux essayer de résoudre les problèmes dans l'ordre.
Tout d'abord essayer avec Firefox, et regarder la console javascript (menu outils > console d'erreurs).

J'ai jeté un coup d'oeil, il manque déjà un </style> qui devrait se trouver là :

  </style>

<!-- definition des smartblock -->

Sans ce </style>, le script plus bas n'est pas executé.

Pour les css : le plus simple c'est de modifier les chemins /img/ en /images/

| [^] | Répondre
Re: par thierry le Mercredi 10/03/2010 à 16:42

Tu as raison. J'ai corrigé l'erreur.

Oui, bien sûr la console d'erreur de firefox, je n' y étais pas, excuse-moi.

Je vais tout reprendre du début. Je vais faire quelques essais sur des pages en local avant de reprendre.

Où me conseilles-tu de mettre les fichiers js et css qui doivent être appelés?

Je me permettrais alors de te recontacter pour faire le point.

Merci encore.

Thierry.

| [^] | Répondre
une solution aprés tatonnements par thierry le Vendredi 19/03/2010 à 14:55

Bonjour Stéphane,

Aprés avoir obtenu ce que je souhaitais sur une page en local (fonctionnement avec appel des scripts sur le serveur), cela ne fonctionnait toujours pas en recréant cette page sur le site, avec l'appel des scripts entre les balises <head>.

J'ai mis l'appel des scripts dans le bloc html juste avant les <div> et là cela fonctionne.
Mais la fonction zoom sur les photos ne fonctionne plus.

J'en déduis qu'il y a une sorte de conflit entre les scripts jquery et jdgallery.
Lorsque l'on met le jdgallery dans <head>, il se fait visiblement "annuler" par jquery qui s'écrit toujours après coté serveur.
En mettant jdgallery et tout le reste dans le bloc html, c'est lui qui devient prioritaire.
Mais du coup la fonction zoom ne fonctionne plus, choix cornélien?
Pas tant que ça, car je n'affiche ce bloc que sur la page d'accueil et donc les pages d'articles contenant des photos bénéficie alors du zoom bien sympathique.

J'ai essayé avec les versions "utilisateur de jquery" mais sans succés...

Peut-être cela n'est pas très orthodoxe mais cela fonctionne..

A signaler un petit ajout qui permet d'afficher les images dans un ordre aléatoire à chaque chargement de page...bien pratique lorqu'on a pas mal de photos...

http://petitlien.fr/randomize sur le site dynamicdrive signalé par aquariuswb sur le forum smoothgallery.

En tout cas merci pour ton aide,

Thierry


| [^] | Répondre
Re: une solution aprés tatonnements par Stephane le Vendredi 19/03/2010 à 15:34

Stephane Si je me souviens bien, c'est jquery et Mootools qui ne font pas bon ménage ensemble. Il y a une version "namespaced" de Mootools qui permet d'éviter les conflits, je viens de la retrouver :

<link rel="stylesheet" href="/public_images/jd.gallery/1.2/css/jd.gallery.css" type="text/css" media="screen" charset="utf-8" /> <script src="/public_images/jd.gallery/1.2/scripts/mootools.namespaced.js" type="text/javascript"></scrip <script src="/public_images/jd.gallery/1.2/scripts/jd.gallery.namespaced.js" type="text/javascript"></script>

C'est ce que j'ai mis juste avant le </head> pour faire le slideshow des articles (tu as le code complet en regardant le code source de la page d'accueil du site des utilisateurs)

| [^] | Répondre
Re: une solution aprés tatonnements par thierry le Vendredi 19/03/2010 à 17:27

Oui, j'ai bien essayé cette solution (assez rapidement je le reconnais) et j'ai bien vu  le code source viabloga  mais le slideshow ne marche plus.(!?!)
Je n'ai pas le temps pour le moment de me pencher plus en avant sur la question, je vais donc laisser la page telle qu'elle est.

Merci et bonne fin de journée...

| [^] | Répondre

Session

Pour participer plus facilement, ouvrez une session :

Identifiant de
mon blog
Nom d'utilisateur
Mot de passe

Si vous avez déjà un blog sur ViaBloga ou si vous avez ouvert un compte sur l'un d'entre eux, vous pouvez vous identifier avec votre nom d'utilisateur et mot de passe en précisant d'abord l'identifiant de votre blog.

S'inscrire

Discussions actives (+ commentaire)

Ailleurs sur ViaBloga

Derniers weblogs mis à jour :

11:18 - P'tit truc
21:31 - La ballade d'un tête en l'air
17:52 - Everitouthèque
11:55 - GRASSE A TOUS
21:13 - Photos Promenade Numérique
08:38 - Voleur d'âme
17:32 -
12:51 - Fédération Apicole de la Charente Maritime - apiculture - abeilles
10:30 - Le blog de Jean-Michel Cornu
13:53 - Recettes de Cuisine - le blog

Toutes les mises à jour

Archives par mois