Centre des communautés

Modification de

Aide:Déroulement

1
  • Cette modification va être annulée. Veuillez vérifier les modifications ci-dessous, puis publier si c’est bien ce que vous voulez faire.
Voir la version courante Votre texte
Ligne 1 : Ligne 1 :
:''Cette fonctionnalité ne fonctionne pas sur appareils mobiles de la même façon que sur orduinateur. Généralement, tout élément en enroulement automatiquement (auto-collapsed) est simplement déroulé sur [[Aide:Mobile|mobile]] et il n'y a aucun bouton pour afficher/masquer. Lors de l'utilisation de cette fonctionnalité, assurez-vous de regarder si ça fonctionne comme vous le souhaitez sur mobile.''
 
 
Le '''déroulement''' (''collapsing'' en anglais) en HTML est une fonctionnalité pour dérouler (ou enrouler) un élément.
 
Le '''déroulement''' (''collapsing'' en anglais) en HTML est une fonctionnalité pour dérouler (ou enrouler) un élément.
   
Ligne 34 : Ligne 33 :
 
Il est possible d'enrouler le texte d'un article, réduisant concrètement la page et permettant aux lecteurs de décider s'ils souhaitent lire le reste des informations.
 
Il est possible d'enrouler le texte d'un article, réduisant concrètement la page et permettant aux lecteurs de décider s'ils souhaitent lire le reste des informations.
   
Exemple :
+
Exemple :
 
<source lang="html4strict" enclose="div">
 
<source lang="html4strict" enclose="div">
 
<div class="mw-collapsible">
 
<div class="mw-collapsible">
Ligne 41 : Ligne 40 :
 
</source>
 
</source>
   
donne&nbsp;:
+
donne :
 
<div class="mw-collapsible" style="overflow: hidden;"><!-- overflow: hidden; due to the float here -->
 
<div class="mw-collapsible" style="overflow: hidden;"><!-- overflow: hidden; due to the float here -->
 
Ce texte peut être enroulé.
 
Ce texte peut être enroulé.
Ligne 48 : Ligne 47 :
 
==Paramètres avancés==
 
==Paramètres avancés==
 
=== État initial ===
 
=== État initial ===
Pour définir l'état initial enroulé, ajoutez <code>mw-collapsed</code> en plus de <code>mw-collapsible</code>, comme montré dans le tableau suivant&nbsp;:
+
Pour définir l'état initial enroulé, ajoutez <code>mw-collapsed</code> en plus de <code>mw-collapsible</code>, comme montré dans le tableau suivant :
   
 
<pre>
 
<pre>
Ligne 60 : Ligne 59 :
 
</pre>
 
</pre>
   
donne&nbsp;:
+
donne :
 
{| class="mw-collapsible mw-collapsed wikitable"
 
{| class="mw-collapsible mw-collapsed wikitable"
 
! L'en-tête || reste visible
 
! L'en-tête || reste visible
Ligne 72 : Ligne 71 :
 
Vous pouvez aussi spécifier quelle partie du contenu doit être déroulant en utilisant <code>mw-collapsible-content</code>.
 
Vous pouvez aussi spécifier quelle partie du contenu doit être déroulant en utilisant <code>mw-collapsible-content</code>.
   
Exemple&nbsp;:
+
Exemple :
 
<source lang="html4strict" enclose="div">
 
<source lang="html4strict" enclose="div">
 
<div class="mw-collapsible mw-collapsed" style="width:100%">
 
<div class="mw-collapsible mw-collapsed" style="width:100%">
Ligne 81 : Ligne 80 :
 
</source>
 
</source>
   
donne&nbsp;:
+
donne :
 
<div class="mw-collapsible mw-collapsed" style="width:100%">
 
<div class="mw-collapsible mw-collapsed" style="width:100%">
 
Ce texte n'est pas déroulant, mais le texte est enroulé (et donc masqué) par défaut :
 
Ce texte n'est pas déroulant, mais le texte est enroulé (et donc masqué) par défaut :
Ligne 89 : Ligne 88 :
   
 
=== Libellés personnalisés ===
 
=== Libellés personnalisés ===
Vous n'aimez pas «&nbsp;Enrouler&nbsp;» / «&nbsp;Dérouler&nbsp;» pour les liens&nbsp;? Pas de problèmes&nbsp;! Modifiez-les en utilisant <code>data-expandtext</code> et <code>data-collapsetext</code>.
+
Vous n'aimez pas « Enrouler » / « Dérouler » pour les liens ? Pas de problèmes ! Modifiez-les en utilisant <code>data-expandtext</code> et<code>data-collapsetext</code>.
   
Exemple&nbsp;:
+
Exemple :
 
<pre>{| class="wikitable mw-collapsible" data-expandtext="Amplificatum" data-collapsetext="Reducto"
 
<pre>{| class="wikitable mw-collapsible" data-expandtext="Amplificatum" data-collapsetext="Reducto"
 
!Mon || en-tête
 
!Mon || en-tête
Ligne 100 : Ligne 99 :
 
|}</pre>
 
|}</pre>
   
donne&nbsp;:
+
donne :
 
{| class="wikitable mw-collapsible" data-expandtext="Amplificatum" data-collapsetext="Reducto"
 
{| class="wikitable mw-collapsible" data-expandtext="Amplificatum" data-collapsetext="Reducto"
 
!Mon || en-tête
 
!Mon || en-tête
Ligne 109 : Ligne 108 :
 
|}
 
|}
   
=== Bouton afficher/masquer ===
+
=== Bouton affiche/masquer ===
 
Vous l'aurez peut-être remarqué dans le tableau donné en exemple ci-dessus, le lien dans la deuxième colonne augmente grandement la largeur du tableau par rapport au texte qu'il contient. Il est possible de palier à cela en plaçant l'action n'importe où ailleurs sur la page.
 
Vous l'aurez peut-être remarqué dans le tableau donné en exemple ci-dessus, le lien dans la deuxième colonne augmente grandement la largeur du tableau par rapport au texte qu'il contient. Il est possible de palier à cela en plaçant l'action n'importe où ailleurs sur la page.
   
Ligne 116 : Ligne 115 :
 
Ceci s'occupe du tableau même. Ensuite, nous devons ajouter un élément bouton/lien/texte avec la classe <code>mw-customtoggle-myTable</code> (veuillez noter que c'est une '''classe''' et non un '''ID''' comme ci-dessus).
 
Ceci s'occupe du tableau même. Ensuite, nous devons ajouter un élément bouton/lien/texte avec la classe <code>mw-customtoggle-myTable</code> (veuillez noter que c'est une '''classe''' et non un '''ID''' comme ci-dessus).
   
Exemple&nbsp;:
+
Exemple :
 
<pre>{| class="wikitable mw-collapsible" id="mw-customcollapsible-myTable"
 
<pre>{| class="wikitable mw-collapsible" id="mw-customcollapsible-myTable"
 
!Mon || en-tête
 
!Mon || en-tête
Ligne 125 : Ligne 124 :
 
|}
 
|}
   
<div class="mw-customtoggle-myTable communauté-menu-button">Afficher/Masquer tableau</div></pre>
+
<div class="mw-customtoggle-myTabla communauté-menu-button">Afficher/Masquer tableau</div></pre>
   
 
{| class="wikitable mw-collapsible" id="mw-customcollapsible-myTable"
 
{| class="wikitable mw-collapsible" id="mw-customcollapsible-myTable"
Ligne 135 : Ligne 134 :
 
|}
 
|}
   
<span class="mw-customtoggle-myTable communauté-menu-button">Afficher/Masquer tableau</span>
+
<span class="mw-customtoggle-myTabla communauté-menu-button">Afficher/Masquer tableau</span>
   
 
== Voir aussi ==
 
== Voir aussi ==
*[[w:c:dev:ShowHide|ShowHide]] sur le [[w:c:dev|Developer's Wiki]]
+
*{{#NewWindowLink:http://dev.wikia.com/index.php?title=ShowHide|ShowHide}} sur le {{#NewWindowLink:http://dev.wikia.com|Developer's Wiki}}
*[[mw:Manual:Collapsible elements|Éléments déroulants]] sur [[mw:|MediaWiki.org]] (en anglais)
+
*{{#NewWindowLink:mw:Manual:Collapsible elements|Éléments déroulants}} sur {{#NewWindowLink:mw:|MediaWiki.org}} (en anglais)
   
 
{{Plus d'aide}}
 
{{Plus d'aide}}
   
[[be:Даведка:Табліцы/згортваюцца]]
 
[[de:Hilfe:Ausklappbare Elemente]]
 
 
[[en:Help:Collapsing]]
 
[[en:Help:Collapsing]]
 
[[es:Ayuda:Colapsando]]
 
[[es:Ayuda:Colapsando]]
Ligne 151 : Ligne 148 :
 
[[pt:Ajuda:Collapsing]]
 
[[pt:Ajuda:Collapsing]]
 
[[ru:Справка:Сворачивание]]
 
[[ru:Справка:Сворачивание]]
[[tr:Yardım:Daraltma]]
 
[[uk:Довідка:Таблиці/що згортаються]]
 
 
[[zh:Help:摺疊]]
 
[[zh:Help:摺疊]]
   
  Chargement de l’éditeur...
Attention : pour insérer un lien comportant un espace (ex : « + ») les espaces doivent être des "vrais" insécables (pas des   ou   ). On peut aussi utiliser le -->

Voir ce modèle