Utilisateur:Momo50/Mon bac à sable/Carrousel
De Wikimanche
Galerie d'images
- Attributs et valeurs
mode =
traditionnel
Par défaut, l'effet est expliqué ci-dessousnolines
Pas de bordures, moins de remplissage, légendes centrées sous les imagespacked
Toutes les images sont alignées en ayant la même hauteur, justifiée, les légendes centrées sous les imagespacked-overlay
Comme packed, mais la légende recouvre l'image, dans une boîte translucidepacked-hover
Comme packed-overlay, mais la légende n'est visible que sur hover (se dégrade gracieusement sur les lecteurs d'écran, et retombe en superposition si un écran tactile est utilisé)slideshow
Diaporama
caption =
Ajoute une légende globale au-dessus de la galeriewidths =
Largeurs d'image en pixels (n'a aucun effet si le mode est défini sur packed, packed-overlay, packed-hover ou slideshow)hauteurs =
Hauteur de l'image en pixels (n'a aucun effet si le mode est défini sur le diaporama)perrow =
Nombre d'images par ligne (n'a aucun effet si le mode est réglé sur packed, packed-overlay, packed-hover ou slideshow; Voir les notes d'utilisation, ci-dessous )showfilename = yes
Afficher chaque nom de fichier sous l'image correspondanteclass =
Un ou plusieurs noms de classes séparés par des espaces et placés entre guillemetsstyle =
Une ou plusieurs déclarations CSS séparées par des points-virgules et placées entre guillemets
- Notes d'utilisation
- L'utilisation inconsidérée de l'attribut
perrow
est fortement déconseillée, car elle remplace l'utilisation flexible de différentes tailles d'affichage et de ratio d'aspect, allant des miniatures mobiles aux larges écrans "cinéma". Cependant, l'attribut devrait être utilisé lorsqu'un arrangement de réseau fixe est approprié, tel que 'avant / après', 'bas / moyen / haut', ou d'autres comparaisons systématiques d'images. - Si
perrow
est omis, la largeur est fluide: une ligne comprend autant d'images que possible sur la largeur disponible de l'affichage de l'utilisateur, enveloppant automatiquement autant de lignes supplémentaires que nécessaire. - Omettre
perrow
est maintenant recommandé par défaut . Avant MediaWiki 1.17, la valeur par défaut était 4. - La largeur et la hauteur par défaut sont actuellement 120px. Il est recommandé de ne pas trop spécifier la taille (à la place, acceptez la taille par défaut), à moins qu'il y ait une forte raison de remplacer les préférences d'affichage de l'utilisateur ; voir WP:Considérations physiques sur les images pour plus d'explications sur ce problème.
- Le mode
packed
ajuste automatiquement la taille des images pour utiliser l'espace d'affichage disponible de façon optimale. - Chaque ligne spécifie un fichier image. Le préfixe
File:
est facultatif. Cependant, il est utile de l'inclure comme aide pour localiser rapidement les spécificateurs d'image dans le wikitext (par exemple, lors du nettoyage de la mise en page). - Le paramètre "thumb" n'est pas valide et ne doit pas être utilisé.
- Les Légendes sont facultatives et sont séparées du nom de fichier par une barre verticale ("|").
- Les crochets ("[" ou "]") ne doivent pas être inclus, à l'exception de Wikilinks inclus dans les légendes .
- Une erreur fréquente consiste à oublier la balise de fermeture
</gallery>
. - Lors de l'utilisation, notez que de nombreux paramètres, notamment ceux relatifs à l'aspect visuel, peuvent ne pas s'appliquer ou fonctionner comme prévu sur certains skins (notamment le skin Minerva utilisé par le site mobile)
Exemple de diaporama
Test css [1]
Data-options [2]
JS $(document).foundation({ orbit: { animation: 'slide', // Définit le type d'animation utilisé pour la transition entre les diapositives, peut également être 'fade' timer_speed: 10000, // Définit la durée en millisecondes avant la transition d'une diapositive pause_on_hover: true, // Pauses sur la diapositive en cours pendant le survol resume_on_mouseout: false, // Si la pause sur hover est définie sur true, ce paramètre reprend la lecture après le passage de la souris hors de la diapositive next_on_click: true, // Passer à la diapositive suivante sur un clique animation_speed: 500, // Définit la durée en millisecondes de la transition entre les diapositives stack_on_small: false, navigation_arrows: true, // Définit l'affichage ou non des flèches de navigation avant arrière slide_number: true, // Affiche le nombre de diapositives slide_number_text: 'of', container_class: 'orbit-container', stack_on_small_class: 'orbit-stack-on-small', next_class: 'orbit-next', // Nom de classe donné au bouton suivant prev_class: 'orbit-prev', // Nom de la classe donné au bouton précédent timer_container_class: 'orbit-timer', // Nom de la classe donné à la minuterie timer_paused_class: 'paused', // Nom de la classe donné au bouton en pause timer_progress_class: 'orbit-progress', // Nom de la classe donné à la barre de progression slides_container_class: 'orbit-slides-container', // Nom de classe donné au conteneur de diapositives preloader_class: 'preloader', // Classe donnée au préchargeur slide_selector: 'li', // La valeur par défaut est '*' qui sélectionne tous les enfants sous le conteneur bullets_container_class: 'orbit-bullets', bullets_active_class: 'active', // Nom de classe donné à la balle active slide_number_class: 'orbit-slide-number', // Nom de classe donné au numéro de diapositive caption_class: 'orbit-caption', // Nom de classe donné à la légende active_slide_class: 'active', // Nom de la classe donné à la diapositive active orbit_transition_class: 'orbit-transitioning', bullets: true, // Est-ce que le curseur a des puces visibles ? circular: true, // Est-ce que le curseur doit aller à la première diapositive après avoir montré la dernière ? timer: true, // Est-ce que le curseur a une minuterie active ? Le réglage sur false désactive la minuterie. variable_height: false, // Le curseur a-t-il un contenu de hauteur variable ? swipe: true, before_slide_change: noop, // Exécuter une fonction avant que la diapositive ne change after_slide_change: noop // Exécuter une fonction après le changement de diapositive } });
Notes
- ↑ MediaWiki Pivot Skin contributors, "Slider," MediaWiki Pivot Skin, https://pivot.wikiproject.net/w/index.php?title=Slider&oldid=21 (accédé le 4 août 2017).
- ↑ Zurb Foundation Orbit Slider documentation, http://foundation.zurb.com/sites/docs/v/5.5.3/components/orbit.html (accédé le 10 septembre 2017).