« Modèle:Boîte déroulante » : différence entre les versions

De 21Wiki
Aucun résumé des modifications
Balise : Éditeur de wikicode 2017
Aucun résumé des modifications
Balise : Éditeur de wikicode 2017
Ligne 1 : Ligne 1 :
<includeonly>
<div class="toggleBox" style="border:1px solid black;padding:1em;">
<div class="toggleBox" style="border:1px solid black;padding:1em;">
     <h3 onclick="toggleBox(this)">Titre de la boîte</h3>
     <h3 onclick="toggleBox(this)">{{{titre|Titre de la boîte}}}</h3>
     <pre>
     <pre>
         <nowiki>
         <nowiki>
             {| class="wikitable"
             {{{tableau|{| class="wikitable"
             ! Entête 1 !! Entête 2 !! Entête 3
             ! Entête 1 !! Entête 2 !! Entête 3
             |-
             |-
Ligne 10 : Ligne 11 :
             | Ligne 2, cellule 1 || Ligne 2, cellule 2 || Ligne 2, cellule 3
             | Ligne 2, cellule 1 || Ligne 2, cellule 2 || Ligne 2, cellule 3
             |}
             |}
            }}}
         </nowiki>
         </nowiki>
     </pre>
     </pre>
Ligne 23 : Ligne 25 :
     });
     });
</script>
</script>
</includeonly>
<noinclude>
Ce modèle permet de créer une boîte déroulante contenant un tableau.
Syntaxe :<br />
<code>{{Boîte déroulante|titre=Titre de la boîte|tableau={{!}}-
! Entête 1 !! Entête 2 !! Entête 3
{{!}}-
| Ligne 1, cellule 1 || Ligne 1, cellule 2 || Ligne 1, cellule 3
{{!}}-
| Ligne 2, cellule 1 || Ligne 2, cellule 2 || Ligne 2, cellule 3
{{!}}}}</code>
Le paramètre "titre" est optionnel et définit le texte qui s'affiche dans le titre de la boîte déroulante.
Le paramètre "tableau" est optionnel et permet de définir le contenu du tableau qui s'affiche dans la boîte déroulante.
Ce modèle utilise la bibliothèque jQuery pour créer la boîte déroulante. Si vous ne souhaitez pas utiliser cette bibliothèque, vous pouvez remplacer le code JavaScript par une autre solution.
</noinclude>

Version du 3 mars 2023 à 12:27


Ce modèle permet de créer une boîte déroulante contenant un tableau.

Syntaxe :

Titre de la boîte

        
            {{{tableau|{| class="wikitable"
            ! Entête 1 !! Entête 2 !! Entête 3
            |-
            | Ligne 1, cellule 1 || Ligne 1, cellule 2 || Ligne 1, cellule 3
            |-
            | Ligne 2, cellule 1 || Ligne 2, cellule 2 || Ligne 2, cellule 3
            |}
            }}}
        
    

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <script>

   $(function() {
       $('.toggleBox pre').hide();
       $('.toggleBox h3').click(function() {
           $(this).parent().find('pre').toggle();
       });
   });

</script>


Le paramètre "titre" est optionnel et définit le texte qui s'affiche dans le titre de la boîte déroulante.

Le paramètre "tableau" est optionnel et permet de définir le contenu du tableau qui s'affiche dans la boîte déroulante.

Ce modèle utilise la bibliothèque jQuery pour créer la boîte déroulante. Si vous ne souhaitez pas utiliser cette bibliothèque, vous pouvez remplacer le code JavaScript par une autre solution.