Tableau : Afficher tout le contenu sans ascenseur (resize ?)

Hello,
En utilisant javascript ou jQuery pour définir font-size et line-height des lignes du tableau en fonction du nombre de lignes à afficher dans le tableau, on arrive à un résultat très acceptable.

On a besoin de deux valeurs qu'on peut récupérer sans difficulté :

- nl le nombre de lignes (donné par le résultat de la requête en PHP, quelque chose du genre mysql_num_rows($query) ou autre ), et inséré dans le code Javascript sous la forme :

var nl = <?php echo mysql_num_rows($query); ?>

- h la hauteur en pixels du tableau contenant les lignes de résultat (hauteur du viewport/fenêtre diminuée des éléments avant le tableau, si nécessaire), récupérée par Jquery

Ensuite c'est tout simple :
line-heigt = h / nl (arrondi à l'entier inférieur)
font-size = line-heigt / 1,2

et on affecte les valeurs avec avec jQuery.

j'ai fait quelques essais sans utiliser javascript, juste en changeant la hauteur de ma fenêtre, avec 10 lignes de texte : je change les valeurs dans la css en fonction de la hauteur (affichée par l'inspecteur de mon navigateur), et tout est bon au rechargement de la page.

Appeler le calcul en bas de page, une fois le document chargé, ($(document).ready( function () {...})
il faudra relancer le calcul à chaque resize de la page, bien entendu.
Modifié par farang (04 Oct 2016 - 11:42)