Comment corriger la ligne d'en-tête et la première colonne d'un tableau défilant avec JavaScript ?

Comment verrouiller la première ligne et la première colonne d'un tableau défilant à l'aide de JavaScript

Verrouillage de la première ligne et de la première colonne d'un tableau lorsque le défilement peut être une fonctionnalité utile pour les grands tableaux contenant des informations importantes en haut et à gauche. Bien que CSS à lui seul ne puisse pas y parvenir, JavaScript offre une solution.

Considérez le plugin fxdHdrCol comme une solution JavaScript potentielle. Ce plugin convertit un tableau HTML standard en un tableau déroulant avec des en-têtes et des colonnes de tableau fixes. Il permet au tableau de défiler horizontalement et verticalement tout en gardant la première ligne et la première colonne en place.

Pour utiliser fxdHdrCol, passez simplement les paramètres suivants au plugin :

<code class="javascript">$('#myTable').fxdHdrCol({
    fixedCols    : 3,       /* 3 fixed columns */
    width        : "100%",  /* set the width of the container (fixed or percentage)*/
    height       : 500      /* set the height of the container */
});</code>

En précisant le paramètre fixedCols, vous pouvez définir le nombre de colonnes fixes dans le tableau. Vous pouvez également définir la largeur et la hauteur du conteneur pour l'adapter à la table.

Pour une démonstration complète et une documentation, reportez-vous au lien fourni dans la réponse originale. Cette solution verrouille efficacement la première ligne et la première colonne d'un tableau, offrant ainsi une expérience de défilement plus conviviale.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!