Modèle:Sticky header

Documentation[voir] [modifier] [historique] [purger]

Ce modèle utilise la feuille de style Sticky header/styles.css en CSS. Voir l'aide de l'extension TemplateStyles si vous voulez en savoir plus.

Utilisation

Ce modèle est destiné à forcer une fixation des en têtes de table de sorte que ces en-têtes restent lisibles en permanence à l'écran. Incluez ce modèle en ajoutant {{Sticky header}} ou {{sticky header}} au-dessus d'un tableau. Puis, ajoutez l'une des classes suivantes au texte wiki de début de table:

Classes pour le texte wiki de début de table : `{| class="class1 class2"`.
Class	Description
`sticky-header`	Rendre la première rangée d'en-tête collante.
`sticky-header-multi`	Rendre plusieurs lignes d'en-tête collantes en haut. Nécessite une table triable avec `{\| class="… sortable …"`. Evitez de l'utiliser avec la classe `sorttop` qui devient collante après tri. Évitez de créer des lignes d'en-tête trop hautes qui pourraient bloquer trop de données sur les écrans courts (par exemple, affichage paysage sur mobile).

Paramètres

Description du modèle à compléter.

Paramètres du modèle[Modifier les données du modèle]
Paramètre		Description	Type	État
Aucun paramètre spécifié

Exemples

Ligne d'en-tête collante unique

La classe sticky-header est utilisée pour rendre collante la première ligne d’en-tête. Le tri n’est pas obligatoire.

{{Sticky header}}
{| class="wikitable sticky-header alternance collapsible"
|+ Sous-titre de tableau
! Mois !! Tri1 !! Tri2
|-
| janvier || 1 || 24
|-
| février || 2 || 23
|-
| mars || 3 || 22
|-
| avril || 4 || 21
|-
| mai || 5 || 20
|-
| juin || 6 || 19
|-
| juillet || 7 || 18
|-
| août || 8 || 17
|-
| septembre || 9 || 16
|-
| octobre || 10 || 15
|-
| novembre || 11 || 14
|-
| décembre || 12 || 13
|-
| janvier || 13 || 12
|-
| février || 14 || 11
|-
| mars || 15 || 10
|-
| avril || 16 || 9
|-
| mai || 17 || 8
|-
| juin || 18 || 7
|-
| juillet || 19 || 6
|-
| août || 20 || 5
|-
| septembre || 21 || 4
|-
| octobre || 22 || 3
|-
| novembre || 23 || 2
|-
| décembre || 24 || 1
|- class=sortbottom
| '''Total''' || 26 || 30
|}

Plusieurs lignes d'en-tête collantes

Enregistré sur Phabricator
Tâche 6740

Enregistré sur Phabricator
Tâche 355492

La classe sticky-header-multi est utilisée pour rendre plusieurs lignes d’en-tête collantes. Une table sortable est requise car la table triable est actuellement le seul moyen de déplacer des lignes consécutives d'en-têtes de colonnes vers l'élément <thead> . Si certaines ou toutes les colonnes ne doivent pas être triables, alors class=unsortable peut être placé dans la cellule d'en-tête avec l'icône de tri. Le dessus de la table sera toujours collant. Voir Aide Tableaux triables. Si JavaScript est désactivé, alors sortable et cette solution ne fonctionnerons pas.

Évitez d'utiliser la classe sorttop car sortable déplace ces lignes dans l'élément <thead> après le tri, ce qui les rend également très collantes. Une solution pourrait être de les déplacer vers le bas et d'utiliser la classe sortbottom à la place.

Démonstration en cas de double en-têtes
Mois	Couleur	Données
Mois	Couleur	info1	info2	info3
janv-00	blanc	a	α	あ
févr-00	noir	b	β	か
mars-00	rose	c	γ	さ
avr-00	blanc	d	δ	た
mai-00	noir	e	ε	な
juin-00	rose	a	ζ	は
juil-00	blanc	b	η	ま
août-00	noir	c	θ	や
sept-00	rose	d	ι	ら
oct-00	blanc	e	κ	わ
nov-00	noir	a	λ	い
déc-00	rose	b	μ	き
janv-01	blanc	c	ν	し
févr-01	noir	d	ξ	ち
mars-01	rose	e	ο	に
avr-01	blanc	a	π	ひ
mai-01	noir	b	ρ	み
juin-01	rose	c	σ	り
juil-01	blanc	d	α	う
août-01	noir	e	β	く
sept-01	rose	a	γ	す
oct-01	blanc	b	δ	つ
nov-01	noir	c	ε	ぬ
déc-01	rose	d	ζ	ふ
nombre de valeur différente	3	5	24	24

{{Sticky header}}
{| class="wikitable collapsible sortable alternance sticky-header-multi"
|+ Démonstration en cas de double en-têtes
! rowspan=2|Mois 
! rowspan=2|Couleur
! colspan=3|Données
|-
! info1
! info2
! class="unsortable" | info3
|-
! janv-00
| blanc || a || α || あ
|-
! févr-00
| noir || b || β || か
|-
! mars-00
| rose || c || γ || さ
|-
! avr-00
| blanc || d || δ || た
|-
! mai-00
| noir || e || ε || な
|-
! juin-00
| rose || a || ζ || は
|-
! juil-00
| blanc || b || η || ま
|-
! août-00
| noir || c || θ || や
|-
! sept-00
| rose || d || ι || ら
|-
! oct-00
| blanc || e || κ || わ
|-
! nov-00
| noir || a || λ || い
|-
! déc-00
| rose || b || μ || き
|-
! janv-01
| blanc || c || ν || し
|-
! févr-01
| noir || d || ξ || ち
|-
! mars-01
| rose || e || ο || に
|-
! avr-01
| blanc || a || π || ひ
|-
! mai-01
| noir || b || ρ || み
|-
! juin-01
| rose || c || σ || り
|-
! juil-01
| blanc || d || α || う
|-
! août-01
| noir || e || β || く
|-
! sept-01
| rose || a || γ || す
|-
! oct-01
| blanc || b || δ || つ
|-
! nov-01
| noir || c || ε || ぬ
|-
! déc-01
| rose || d || ζ || ふ
|}

Voir aussi

La documentation anglaise plus complète : en:Template:Sticky header

Projet Modèle

La documentation de ce modèle est générée par le modèle {{Documentation}}.
Elle est incluse depuis sa sous-page de documentation. Veuillez placer les catégories sur cette page-là.
Les éditeurs peuvent travailler dans le bac à sable (créer) et la page de test (créer).
Voir les statistiques d'utilisation du modèle sur l'outil wstat.

Mois	Tri1	Tri2
janvier	1	24
février	2	23
mars	3	22
avril	4	21
mai	5	20
juin	6	19
juillet	7	18
août	8	17
septembre	9	16
octobre	10	15
novembre	11	14
décembre	12	13
janvier	13	12
février	14	11
mars	15	10
avril	16	9
mai	17	8
juin	18	7
juillet	19	6
août	20	5
septembre	21	4
octobre	22	3
novembre	23	2
décembre	24	1
Total	26	30