Cycle2

La seconde version de la librairie Javascript “jQuery Cycle”, qui permet de produire des diaporamas, se nomme “Cycle2” : http://jquery.malsup.com/cycle2/.

Voici cette nouvelle librairie mise en plugin pour SPIP.

Si vous utilisez déjà “jQuery Cycle”, vous pouvez le garder tel qu’il est. Cette version est à considérer comme un nouveau diaporama.

Bien que les modèles et certains paramètres aient été conservés pour tenter de préserver une certaine compatibilité, le rendu n’est pas assuré entre la version 2 et cette version 3.

Le principal avantage de cette nouvelle version : l’affichage est adapté aux différentes largeurs d’écrans (responsive design) selon l’interface du site.

Il est nécessaire d’utiliser un squelette qui respecte la norme HTML5.

Pour une utilisation courante, le diaporama (slider pour les anglophones) s’insère dans les textes par le modèle <articleN|cycle> où “N” est le numéro de l’article dont on veut afficher les images.

Pour la compatibilité avec le plugin “jQuery Cycle” le modèle <sjcycleN> est tout à fait fonctionnel. La différence est que ce dernier n’affiche les images de l’article “N” que lorsqu’il est inclus dans l’article “N” lui-même.

Paramétrage général

Si un paramètre de la librairie a été implémenté, il l’a été fidèlement, pour rester dans une logique simple par rapport à Cycle2. On retrouve toute la documentation de référence ici : http://jquery.malsup.com/cycle2/api/.

Par exemple : data-cycle-random=true est un paramétrage du plugin d’origine qui fait tourner les images dans un ordre aléatoire. Ce paramètre est transposé dans le plugin SPIP, et on lui donne une valeur à l’insertion du modèle comme ceci : <articleN|cycle|random=true>.

Si le paramétrage général du plugin prévoit déjà l’ordre aléatoire, toutes les insertions de <articleN|cycle> joueront le diaporama dans un ordre aléatoire. Mais dans ce cas, il est aussi possible d’insérer un diaporama sans ce paramètre avec l’écriture <articleN|cycle|random=false>-

La page de configuration (dans l’administration de SPIP, une fois le plugin installé comme les autres, se rendre dans “Squelettes > Cycle2”, accès limité aux webmestres du site) offre un certains nombre d’options qui s’appliqueront à toutes les inclusions du modèle <articleN|cycle> :

  • Largeur maximum (par défaut 640) : toutes les images seront retaillées en largeur à cette valeur, en pixels. Les diaporamas étant en taille proportionnelle, ils s’adapteront à la largeur définie par l’interface du site, mais dans la limite définie ici.
    • |largeurmax=350
  • Hauteur maximum : en laissant le champ vide, les images seront toujours à la largeur maximum possible. Sinon toutes les images seront retaillées en hauteur à cette valeur, en pixels. Si la largeur de l’image n’est pas suffisante, la couleur de fond configurée sera visible. La valeur de couleur de fond “transparent” rendra par contre un fond blanc.
    • |hauteurmax=240
  • Hauteur automatique : Choisissez ici la façon dont est déterminée la hauteur du diaporama. Par défaut (le champ vide), la hauteur de la première image sert de valeur, “calc” utilisera la hauteur de la plus haute image, et “container” ajustera la hauteur du diaporama à la hauteur de l’image courante. Il est possible de forcer le ratio hauteur/largeur avec une double valeur, par exemple “600:400”. La valeur “false” empêchera le script de gérer la hauteur automatiquement.
    • |autoheight=600:400 ou |autoheight=container
  • Temps d’affichage pour chaque image (en millisecondes) : choisir “0” pour faire un diaporama manuel (cf les boutons “précédent” et “suivant” pour activer le défilement manuel).
    • |timeout=4000
  • Temps de transition entre chaque image (en millisecondes)
    • |speed=1000
  • Temps d’attente : Temps d’attente avant le départ du diaporama (en millisecondes).
    • |delay=6000
  • Effet de transition : voir les exemples en ligne - fade - fadeout - scrollHorz - scrollVert - flipHorz - flipVert - shuffle - tileSlide - tileBlind - carousel - none
    • exemple : |fx=scrollHorz
    • pour |fx=tileSlide et |fx=tileBlind, option supplémentaire pour jouer l’animation verticalement
    • pour |fx=carousel, options supplémentaires pour :
      • choisir le nombre de diapositives affichées simultanément (carousel-visible) : |carouselvisible=3
      • le décalage (en pixels) de la première diapositive (carousel-offset) : |carouseloffset=30
      • définir la dimension des vignettes. Largeur (carousel horizontal) ou hauteur (carousel vertical) d’une diapositive (carousel-slide-dimension) : |carouselslidedimension=130
      • jouer le déplacement verticalement (carousel-vertical) : |carouselvertical=true ou |carouselvertical=false
      • adapter le carousel à la mise en page, seulement si horizontal (carousel-fluid) : |carouselfluid=true ou |carouselfluid=false
  • À l’envers : Joue le diaporama à rebours :
    • |reverse=true ou |reverse=false
  • Synchronisation des animations, l’arrivée d’une image est simultanée avec le départ de la précédente :
    • |sync=true ou |sync=false
  • Pause au survol : |pauseonhover=true ou |pauseonhover=false
  • Message lors de la pause au survol, laisser vide pour ne rien afficher :
    • |pauseonhovercontent=en pause
  • Ordre aléatoire :
    • |random=true ou |random=false
  • Bouton “suivant” : cibler un bloc html par sa classe ou son identifiant. Par défaut “.cycle-next” place une flèche à droite au survol de l’image. [1] :
    • |next=.cycle-next
  • Bouton “précédent” : cibler un bloc html par sa classe ou son identifiant. Par défaut “.cycle-prev” place une flèche à gauche au survol de l’image. [1] :
    • |prev=.cycle-prev
  • En boucle, à propos des boutons “précédent” et “suivant” : à la fin du diaporama, ne pas revenir au début, ou bien au début, ne pas suivre à la fin (n’empêche pas le diaporama automatique de tourner en continu) :
    • |allowwrap=true ou |allowwrap=false
  • Départ arrêté :
    • |paused=true ou |paused=false
  • Pagination : cibler un bloc html qui contiendra la pagination en nommant sa classe ou son identifiant css. Par défaut “.cycle-pager” place les boutons par-dessus l’image. [1] :
    • |pager=.cycle-pager
  • Afficher une légende pour chaque image [1]. Par défaut “.cycle-caption” :
    • |caption=.cycle-caption. Il est possible de choisir le contenu de cette légende (cf la documentation) :
    • Afficher le décompte/le total : par défaut
    • Afficher le titre du document : |captiontemplate="{{alt}}"
    • Sur-mesure : |captiontemplate="images {{slideNum}} sur {{slideCount}}"
    • Sur-mesure : |captiontemplate=image {{slideNum}} : {{cycleTitle}} {{cycleDesc}}
  • Afficher une seconde légende en surimpression [1], un calque noir/transparent sur le bas de l’image pour afficher une légende avec Titre et Description de l’image :
    • |overlay=.cycle-overlay
  • Format de la légende en surimpression, par défaut le titre et la description de l’image, vous pouvez personnaliser le contenu suivant les exemples :
    • |overlaytemplate="<span class=left>&nbsp;<br>{{slideNum}} / {{slideCount}}</span>{{date}} - {{title}}<br>{{desc}}"
  • Choisir une couleur de fond, une valeur de couleur hexadécimale avec le “#”, ex “#C5E41C”. La valeur “transparent” rétabli la transparence. :
    • |backgroundcolor=#b5b5b5
    • en installant le plugin Palette vous pourrez piquer la couleur sur une palette.

Paramètres tooltip et mediabox

  • Info au survol avec Tooltip : peut être surchargé lors de l’inclusion avec |tooltip=oui ou |tooltip=non
  • Afficher les caractéristiques techniques de l’image : peut être surchargé lors de l’inclusion avec |tooltip_carac=oui ou |tooltip_carac=non
  • Mediabox : ouvre l’image d’origine suivant vos paramétrages de la mediabox (dans l’administration : Squelettes > Boîte multimédia. Peut être surchargé lors de l’inclusion avec |mediabox=oui ou |mediabox=non

Inclure le modèle <articleN|cycle>

On l’a déjà vu plus haut, pour une utilisation courante, le diaporama s’insère dans les textes par le modèle <articleN|cycle> où “N” est le numéro de l’article dont on veut afficher les images. On peut insérer ce modèle dans n’importe quel autre article que l’article N lui-même.

Chaque paramètre de la configuration générale est actif et en même temps corrigeable lors de l’inclusion. (cf. plus haut pour chacun d’eux)
En dehors de ces paramètres généraux, voici quelques paramètres optionnels pour ce modèle :

Alignement dans le texte

Comme un autre document, on peut aligner le diaporama : |left, |right ou |center comme ceci <articleN|cycle|left>
S’il n’est pas précisé, l’alignement est “centré”. L’effet rendu dépendra de la valeur saisie pour le paramètre “Largeur maximum” et de l’interface du site. L’alignement flottant est intéressant si le diaporama est significativement moins large que le texte lui-même.


Choisir les images
<articleN|cycle|docs=1,5> fait tourner les images 1 et 5 de l’article “N” en diaporama, dans l’ordre du titre des images.
N” n’est pas obligatoire. On peut maintenant écrire <article|cycle|docs=1,2,3,6,9> pour demander les images 1,2,3,6,9 même si elles sont liées à des articles différents, voir des rubriques ou d’autres objets.

Attention : dans le cas d’une utilisation dans un squelette, l’écriture diffère :
[(#MODELE{article_cycle,id_article=N,docs=21|22|24})]
ou
[(#MODELE{article_cycle,docs=21|22|24})]

Plusieurs diaporamas par page
On peut inclure plusieurs diaporamas par page de la même façon :
<articleX|cycle>
<articleY|cycle>
<articleZ|cycle>

Dans ce cas, si les boutons “suivant/précédent” sont activés dans la configuration générale, ils actionneront tous les diaporamas en même temps. Pour corriger cet effet, il est préférable de personnaliser chaque diaporama comme ceci :

<articleN|cycle|prev=.pre1|next=.suiv1>
<a href="#" class="pre1">précédent</a>
<a href="#" class="suiv1">suivant</a>
<articleN|cycle|prev=.pre2|next=.suiv2>
<a href="#" class="pre2">précédent</a>
<a href="#" class="suiv2">suivant</a>
<articleN|cycle|prev=.pre3|next=.suiv3>
<a href="#" class="pre3">précédent</a>
<a href="#" class="suiv3">suivant</a>

Encore faut-il ensuite styler ces balises HTML aux couleurs de votre site...

Paramètre “lien_parent”
|lien_parent=oui
Crée un lien sur chaque image vers l’objet auquel elle est liée, que ce soit les images d’un seul article, ou bien sélectionnées individuellement |docs=1,2,3,6,9. Si une image est liée à plusieurs objets, ce sera le dernier en date qui sera utilisé.

Paramètres “lien_article” et “forcer_lien_reference”

<articleN|cycle|lien_article=XXX|forcer_lien_reference=oui>


Permet de poser un lien sur le diaporama vers un article, celui qui contient les images ou un autre. Dans le cas d’un site multilingue, fournir l’id de l’article de référence, le modèle se charge de trouver l’id de l’article correspondant à la langue du visiteur. Cette option désactive l’ouverture vers une box. Si l’article n’existe pas dans la langue courante on met ou pas un lien vers l’article de référence suivant que le paramètre forcer_lien_reference soit défini ou pas.

Exemple dans le cas d’une insertion dans un squelette sur une page sommaire :
-  [(#MODELE{article_cycle,id_article=16,lien_article=171})] : diaporama sur toutes les images de l’article 16 avec un lien vers l’article 171 (ou sa traduction)
-  

[(#MODELE{article_cycle,id_article=16,lien_article=171|forcer_lien_reference=oui})]

: c’est pareil sauf que le lien ne se fera pas sur la traduction même si elle existe.


Paramètres “liens_individuels”
<articleN|cycle|liens_individuels=article>
Permet de poser un lien sur chaque image du diaporama vers un article, une rubrique ou un site externe suivant la valeur du paramètre (article, rubrique, externe). Si la valeur vaut article ou rubrique, l’identifiant de l’objet est pris dans le champ descriptif de chaque image. Si la valeur vaut externe, le champ descriptif de chaque image doit contenir un lien http. Cette option désactive l’ouverture vers une box.

Exemple :
-  <article16|cycle|center|liens_individuels=article> : diaporama sur toutes les images de l’article 16 avec sur chaque image un lien vers l’article dont l’identifiant est contenu dans le descriptif de l’image.

Paramètre “limite” :
<articleN|cycle|limite=3>
Sortira les trois premières images de l’article “N” dans le diaporama.

Diaporama des images d’une rubrique

Le modèle rubrique_cycle.html est fait pour ça.
<rubriqueN|cycle> où “N” est l’identifiant de la rubrique concernée.
Pour compatibilité, le modèle sjcycle_rubrique.html est conservé et permet d’inclure <sjcycle6|rubrique>

Diaporama des sites

Le modèle sjcycle_sites.html est conservé et transposé pour cette version du plugin.

Diaporama des albums

Le plugins Albums permet de regrouper des documents.
L’inclusion de <albumN|cycle> affiche un diaporama des images de l’album N.

Footnotes

[1Peut aussi prendre la valeur de la classe ou de l’identifiant (id) de n’importe quelle balise HTML... astuce : <articleN|cycle|next=.suivante><a href="#" class="suivante">avance rapide</a> dans un texte placera le bouton d’avance rapide sous l’image.

updated on 2 October 2019

Discussion

34 discussions

  • Renée Picard

    Le plugin fonctionne en espace privé uniquement si je mets les # de documents et il ne fonctionne pas en espace public
    <article22|cycle|docs=15,16,17>
    http://www.ctss-genetique.com/spip.php?page=article&id_article=22

    Reply to this message

  • Renée Picard

    Résolu! il y a une incompatibilité avec le couteau suisse. En désactivant ce dernier, tout entre dans l’ordre!

    Reply to this message

  • 10

    Bonjour,
    encore moi, avec une autre question :

    je n’ai pas compris l’utilisation du overlay. Je veux l’utiliser dans un #MODELE, donc j’ai ajouté ,overlay=.cycle-overlay à la fin de mes options, mais ça m’affiche cycle-overlay et non le titre et description de l’image.
    Est-ce qu’il faut faire autrement avec les modeles ? Ou qu’est-ce que est le problème ?
    Merci encore pour vos conseils
    Joz

    • bonjour,
      en fait c’est bien [(#MODELE{article_cycle,id_article,overlay=.cycle-overlay})] dans un squelette d’article qui fonctionne tout seul...
      Il faut aussi renseigner les titres et/ou description de chaque image.

    • Hmm, est-ce que le problème pourrait être que je ne travaille pas avec id_article mais avec docs=1|2|3 ?

    • non non, ça fonctionne aussi
      [(#MODELE{article_cycle,docs=36|37|38|39,overlay=.cycle-overlay})]
      c’est autre chose...

    • Ahlala, j’ai compris au moins pourquoi ça affichait cycle-overlay : dans la page config j’avais copié ça dans Format de la légende en surimpression.
      Je n’avais pas compris à quoi ça sert..

      Et en faite je n’ai toujours pas compris, titre et description de l’image ne sont quand même pas affichés, malgré la case Format de la légende en surimpression vidée.
      Dans la source html de ma page je ne vois que

      <div class="cycle-overlay">
        <div></div>
        <div></div>
      </div>

      Entre temps, pour tester j’ai installé un nouveau spip tout fraiche avec uniquement ce plugin, mais là c’est pareil, les deux divs du overlay sont vides.. (j’ai bien remplie titres et descriptifs de mes images.)

      Une autre idée par où tester ?

    • alors ce n’est pas normal, ça fonctionne bien pour moi... le modèle article_cycle.html comporte la ligne http://zone.spip.org/trac/spip-zone/browser/_plugins_/sjcycle/trunk/modeles/article_cycle.html#L186 qui se rempli correctement si le titre et la description sont renseignés...

      À mon avis c’est le bon modèle, les 2 div pour titre et description sont présentes, mais comment sont rédigés les champs ? C’est étrange...

    • Est-ce que sur la page config ?exec=configurer_sjcycle je dois remplir le champ Légende en surimpression ?
      Actuellement il est vide chez moi, j’avais compris que titre et descriptions sont les valeurs par défaut. c’est correcte ?
      ++
      joz

      ps : entre temps j’ai aussi testé sur une installation vide de spip 3.1beta, mais j’obtiens la même chose, les deux divs sont vides...

    • Bonsoir,
      je ne sais pas où se trouve le problème, je ne peux pas reproduire, pour moi sur une installation neuve de SPIP3.1.0-beta les champs sont bien affichés là où on les attend.
      La configuration du plugin peut être laissée par défaut, sans rien changer après l’installation, puisque là on force le paramètre à l’insertion du modèle...

    • Bonsoir chankalan,
      j’ai fais une installation test avec un spip-3.0.20 sur un hébergement ovh : http://chantier.entraide.be/spip-3.0.20/
      même chose que sur mon autre hébergement et en local.
      Si tu veux je peux t’envoyer le login pour l’espace privé...

      Je veux bien aussi installer un 3.1beta si ça peut servir...
      ++

    • Bonsoir,
      j’ai trouvé le bug avec le paramètre lien_parent, normalement corrigé avec http://zone.spip.org/trac/spip-zone/changeset/91725
      La version 3.4.9 prend ces changements en compte...

    • youppieee tout fonctionne !
      grand grand MERCI
      :)

    Reply to this message

  • 4

    Bonjour,
    chez moi le diaporama fonctionne bien dans iron/chrome, mais pas dans firefox. une idée qu’est-ce qui pourrait coincer ?
    merci pour vos lumières
    joz

    • Bonsoir,
      plutôt difficile de savoir... le javascript est bien activé ?

    • Bonsoir,
      Je présume je js est activé comme il faut, puisque dans iron/chrome ça fonctionne.
      Mais il y a pleinplein d’erreurs de js dans FF.
      Entre temps j’ai fais quelques tests. Est-ce qu’il serai possible qu’il y ai un problème entre zcore et cycle-slideshow ?
      j

    • Non, il n’y a pas de raison. S’il y a d’autres erreurs il faudrait voir en simplifiant, en testant sur un squelette par défaut de SPIP par exemple, sans autres plugins activés, pour trouver la panne...

      (Je parlais de la barre d’outils de Firebug qui permet de couper le javascript pour Firefox uniquement...)

    • ha voila, j’ai trouvé :
      j’avais surchargé jquery avec une nouvelle version. ça ne passe pas semblet-il...
      dommage.
      mais au moins les slides tournent maintenant
      merci pour le plugin en tout cas !
      joz

    Reply to this message

  • 1

    Bonjour
    J’essaye d’utiliser le plugin dans un squelette, je ne suis pas expert.
    J’utilise la syntaxe :
    [(#MODELEarticle_cycle,id_article=232)]

    mais article_cycle n’est pas un squelette dans un dossier /modèles

    Quelle syntaxe utiliser ?

    Merci

    • Bonsoir,
      la syntaxe semble bonne et il y a bien un modèle nommé article_cycle.html dans http://zone.spip.org/trac/spip-zone/browser/_plugins_/sjcycle/trunk/modeles
      Est-ce que le plugin est bien installé et téléchargé correctement ?
      Il faut aussi peut-être vérifier le paramétrage par défaut, sur la page de configuration : “Squelettes > Cycle2” et bien renseigner une largeur maximum, le premier paramètre.
      Merci de faire un retour si ça va toujours pas...

    Reply to this message

  • 4

    bonjour
    ce plugin semble très bien mais petite frustration :)
    L’installation s’est bien déroulée, les paramétrages sont ok, en privé le cycle fonctionne cependant en public il bloque sur une image.
    Auriez vous une piste de réflexion, merci

    • Bonjour,
      il se bloque sur une image et que sur l’espace public ? Étrange...
      Et avec les squelettes-dist, ça donne quoi ?

    • bonsoir
      merci de ton intérêt
      oui étrange
      je suis sous Z avec couteau suisse en gestion de la balise #INSERT_HEAD et je crois qu il y a un soucis avec ça, même mes ouvertures médias sont intempestives, mais je n arrive pas à comprendre pourquoi car tout est par défaut...
      le diap est directement intégré dans l article, c est encore plus troublant.
      squelettes-dist?

    • squelettes-dist : je te propose d’essayer avec le squelette de SPIP par défaut, sans surcharge de squelette, enfin si c’était le cas... sinon il faudrait aussi essayer sans les autres plugins, puis les réactiver un à un pour trouver l’origine du soucis.

    • bonsoir
      ta piste est bonne c est le Z qui mets tout en vrac...
      n ayant pour l instant pas trop le temps, je me suis rabattu sur une alternative.
      Dès que j aurai vraiment résolu, je t en ferai part.
      Merci à toi.

    Reply to this message

  • 4

    Bonsoir
    J ’ai un petit soucis si j ’insère <articleN|cycle> dans un article rien ne se passe ,
    si j ’ajoute la variable largeurmax le diaporama fonctionne.
    exemple <articleN|cycle|largeurmax=450> ---> ok

    Nota:dans la config par défaut |largeurmax=500.

    est ce un “bug” ou une mauvaise configuration de ma part ?

    Bruno

    • Bonsoir,
      je ne vois pas, normalement la valeur par défaut de la page de configuration est prise en compte, sans avoir besoin de la préciser dans la rédaction... entre 500 et 450, la différence est voulue ? Avec 450 dans la configuration ça donne quoi ? C’est possible qu’il y aient des règles css qui gênent ?

    • Bonsoir Chankalan

      c ’est bon ; j ’ ai réussi à le faire fonctionner.
      J ’avais été obligé de mettre dans la config du plugin dans le champs largeur maximum: |largeurmax=450 (voir mon message du 9/11/14) pour faire fonctionner le diaporama des sites
      j ’ ai remplacé |largeurmax=450 par 450 uniquement et maintenant le diaporama des articles fonctionne , mais le diaporama des sites ne fonctionne plus correctement (comme mon message du 9/11 ,taille des miniatures).
      je vais étudier la question des règles css (mais je suis débutant) pour essayer de régler le problème du diaporama des sites
      merci encore pour votre aide.
      Bruno

    • bonsoir Omega,
      je vois pas pourquoi le diaporama des sites marche pas... <sjcycle_sites1> fonctionne chez moi, mais la doc est un peu succincte, je reconnais...

    • Bonjour
      j’ ai réussi a faire fonctionner correctement le diaporama des sites en forçant la hauteur et la largeur , aux valeurs de la config de Thumbsites
      [(#MODELEsjcycle_siteslargeurmax=120hauteurmax=90)]
      attention , manque dans la syntaxe ci dessus les crochets
      merci encore pour votre aide
      Bonne continuation
      Bruno

    Reply to this message

  • 2

    Bonjour à tous
    j ’ essaye de basculer Spip jQuery Cycle vers Cycle2 et j ’ai un probleme sur le diaporama des sites , les miniatures des sites sont affichées en mini mini miniature impossible de les avoir en taille de miniature.
    nota: l ’effet de transition fonctionne , seule la taille est incorrecte
    Auriez vous une idée pour les rendre en taille normale ?
    Merci d ’avance pour votre retour.
    Bruno

    • Bonjour,
      est-ce que la largeur est correctement définie dans la page de configuration ?
      Si la valeur est correcte, il faudrait vérifier les règles css...

    • Bonsoir Chankalan

      Merci à vous pour votre retour rapide , j ’ ai trouvé mon erreur (de débutant) j ’ avais renseigné uniquement la valeur numérique dans la configuration de Cylce , il fallait également mettre le nom de la variable |largeurmax=640 / |hauteurmax=480.

      Merci de votre contribution du plugin Cycle2
      Bonne soirée
      Bruno

    Reply to this message

  • 5

    bonjour
    ayant fait plusieurs diaporamas dans un seul article, je ne veux pas mettre
    pause au survol et Message au survol dans le paramétrage du plugin,
    mais dans chaque paramètre de chaque diaporama dans l’article:
    pour ne pas avoir le même message.
    J’ai ceci qui fonctionne bien pour le premier diapo:
    <article15|cycle|docs=213,214,215,216,217,218,220||hauteurmax=400|largeurmax= 500|next=.cycle-next|prev=.cycle-prev|backgroundcolor=#4CA66B|timeout=4000|fx=fadeout||pauseonhover=true>

    mais impossible de trouver comment avoir un message au survol de la souris dans ce paramétrage. j’ai vraiment cherché longtemps, pour rien.
    Si vous pouviez m’aider, merci

    • Bonjour,
      vous n’étiez sûrement pas très loin pourtant...

      Message lors de la pause au survol, laisser vide pour ne rien afficher :
      |pauseonhovercontent=en pause

      Précision : pour ne rien afficher il faut la présence du paramètre mais sans valeur :
      <article15|cycle|pauseonhover=true|pauseonhovercontent=>

    • bon, il y a encore une coquille
      1)en cochant Pause au survol et en mettant un message dans le parametrage du plugin.
      pauseonhover=true|pauseonhovercontent=>, le message apparaît
      2) en mettant dans le premier diapo: |pauseonhover=false et |pauseonhovercontent=>
      pas de message
      3) si je veux un autre message dans le 2éme diaporama:
      |pauseonhover=true|pauseonhovercontent=ratatouille vous salut>
      ça marche, c’est le nouveau message qui apparaît au passage de la souris

      Mais si je mets un autre message dans le premier diaporama: exemple
      |pauseonhover=true|pauseonhovercontent=le chat Albert vous donne le bonjour>
      J’ai le premier message dans les deux diaporamas “ratatouille vous salut”

      Si j’inverse les messages, c’est toujours celui du 2éme diaporama qui apparaît “le chat d’albert vous donne le bonjour”
      et je voudrai pas le même dans les deux, mais bien chaque phrase dans chaque diapo .

    • Je continue donc, pas moyen et dailleurs toujours aussi bizare:

      pour le 2éme diapo

      • j’enlève pauseonhover=true et pas de changement dans la mesure où j’ai coché dans la configuration du plugin « message au survol de la souris » là c’est normal
        parc contre
      • je met pauseonhover=false :
      • j’ai pas de message au survol, par contre au survol du premier diapo, j’ai toujours le message du 2éme.
        -  
        je nage un peu où y manque un truc dans la programmation du plugin ???

      amicalement

    • En fait c’est pas trop prévu d’afficher un message différent pour informer que le diaporama est en pause, c’est une utilisation détournée. Le bug est pas là où on croit... ;o)
      Pour afficher des informations au survol qui ont du sens par rapport au diaporama et aux images, il faut utiliser les solutions faites pour ça, il y en a même plusieurs :

      • |caption=.cycle-caption
      • |overlay=.cycle-overlay
      • |tooltip=oui

      ...

    • bon, si j’ai bien compris, c’est l’interface entre la chaise et le clavier qui bug sec
      OK, je vais potasser mieux et ça ira

    Reply to this message

  • KOVAL Sébastien - dessign.fr

    bon en effet il faut lire la doc en entier avant de pleurer !!!
    pour le tooltip c’est tout marqué ^^
    reste mon soucis de superposition mais là encore je vais ouvrir mes yeux

    Reply to this message

Comment on this article

Who are you?
  • [Log in]

To show your avatar with your message, register it first on gravatar.com (free et painless) and don’t forget to indicate your Email addresse here.

Enter your comment here

This form accepts SPIP shortcuts {{bold}} {italic} -*list [text->url] <quote> <code> and HTML code <q> <del> <ins>. To create paragraphs, just leave empty lines.

Add a document

Follow the comments: RSS 2.0 | Atom