Bonjour à tous,
Pour une appli Web, j’ai besoin d’afficher des tableaux avec pleins de chiffres. Pour que l’utilisateur ne soit pas perdu en arrivant en bas du tableau, les entêtes de colonnes restent fixes quand on déroule le tableau.
Un petit schéma pour mieux expliquer :
La zone en bleu est un tableau qui contient les entêtes de colonnes.
La zone en orange un div avec overflow, qui contient le tableau des données. L’overflow me permet de gérer la scrollbar automatiquement.
Comme les colonnes de mon tableau sont de largeur variable, j’utilise un javascript pour recaler les entêtes avec les colonnes qui correspondent, avec cette méthode qui me permet de déterminer la largeur finale d’un objet DOM :
[codebox]function getWidthValue(objID) {
var obj = document.getElementById(objID);
var retour = 0;
if (obj) {
var paddingLeft = 0;
var paddingRight = 0;
if(window.getComputedStyle) {
paddingLeft = parseFloat(window.getComputedStyle(obj, "").getPropertyValue("padding-left"));
paddingRight = parseFloat(window.getComputedStyle(obj, "").getPropertyValue("padding-right"));
}
else if(obj.currentStyle) {
paddingLeft = parseFloat(obj.currentStyle.paddingLeft);
paddingRight = parseFloat(obj.currentStyle.paddingRight);
}
retour = obj.clientWidth - (paddingLeft + paddingRight);
}
return retour;
}[/codebox]
Problème: je ne peux pas connaître la largeur de la scrollbar utilisée par le navigateur…
J’utilise une valeur de décalage fixée pour que l’alignement soit parfait sous IE avec le thème XP Luna (environnement client) mais si je pouvais faire en sorte de déterminer cette largeur par javascript, ce serait top!
Quelqu’un sait si c’est possible ?