Bonjour,

Est ce que quelqu'un sait comment faire pour redimensionner des colonnes exactement comme cela mais sans ce qu'il y a au dessus et il faut également noter que lorsque l'on redimensionne une colonne c'est toute la colonne qui bouge et pas lorsque l'on relâche le click de la souris. Et aussi quel(s) langage(s) faut-il utiliser ?

Je connais un peu le javascript, html, php. Je ne sais pas s'il faut créer un datagrid et donc avec quel langage.

Merci

Tout ça c'est du vocabulaire de commercial pour « une table que tu fais bouger la largeur des th avec javascript ».
Dans l'exemple si tu y va doucement, le redimensionnement suis la souris, je présume qu'il a mis un timeout pour effectuer le redimensionnement à la fin supposé du baladage de souris. A mon avis ça rend pas bien. On a l'impression que ça ramme alors que c'est justement fait pour limiter le nombre de redimmensionnement (je suppose). Vaut mieux changer tout comme un bourrin, si y'a un timeout, l'utilisateur voit du lag. m'enfin bref.

Le script en lui même est pas très compliqué, surtout si tu utilise jquery ou yui.

jquery ou yui ce sont bien des librairies ? Ok ben merci pour l'info et je vais voir ce qu'il y a comme tutoriaux sur ces 2 là. Merci

Est ce que tu sais comment faire pour garder une hauteur fixe pour les tr c'est à dire les lignes parce que quand je redimensionne, ça ne me bloque pas et ça masque un peu le texte mais ça s'étale sur une ligne de plus. En fait je voudrais que ça fasse comme dans l'explorateur windows par exemple lorsque je rétrécie le nom (dossier ou document) que ça reste sur une ligne et que ça masque jusqu'à ce que je relâche la souris.

J'espère que tu vois ce que je veux dire.

Merci

un overflow:hidden devrait faire l'affaire

Je viens de voir ta réponse et merci.

Pour l'instant je ne sais pas encore où ni comment le placer mais je vais m'y pencher dessus.

Merci.
Je reviendrais si j'ai encore quelques soucis ou pour mettre la réponse.

@+

Edit: je viens de tester sur le td et cela le masque bien mais en fait c'était déjà comme ça, et ce que tu m'as dit de faire permet au texte de ne pas s'entre chevaucher.

Image au départ:


Image redimensionnée:


Et je voudrais que les tr soient tous d'une même hauteur, j'ai essayé plusieurs fois height en CSS ou min-height et max-height mais ça ne change rien.
J'espère que tu trouveras la solution.

... En gros, tu veux empêcher les nombres et le texte "Nombre d'habitants" de passer sur plusieurs lignes lors du redimensionnement, c'est ça ?

Si oui, c'est bien overflow:hidden qu'il faut utiliser...

Tu l'as appliqué à toutes tes colonnes ?

Je l'ai appliqué comme ça

table tr td{
   overflow : hidden;
}

Et c'est donc bien dans chaque cellule. J'ai essayé d'enlever le overflow : hidden et comme je l'ai dit précédemment, le texte s'entrechevauche est ça donne encore moins bien.
Et pour la question c'est bien ça que toutes les lignes de mon tableau ai la même hauteur.

Aurais-tu un lien vers la page ?

Non comme je teste en local. Est-ce que tu connais un peu JQuery ?

Je ne sais pas si t'a remarqué mais il y a une petite barre noire pour redimensionner. Et comme ce n'est pas moi qui l'ai fait j'ai du mal à tout comprendre. Et je galère depuis quelques temps sur ça et je voudrais le faire moi même avec un tableau simple comme je l'ai fait.

Pourrais-tu m'aider ?

Je viens de faire quelques tests... Et en fait, j'ai l'impression que overflow:hidden ne fonctionne pas sur les tr ou les td...

Je vois pas trop comment tu peux faire là...

Ben ça marche mais le problème c'est qu'il me met ensuite sur plusieurs lignes et c'est pour ça que je voudrais spécifier une hauteur pour toutes les lignes du tableau mais impossible.

Euh mince, j'ai pas écrit ce que je voulais

Le overflow:hidden fonctionne, mais il fait passer à la ligne quand il le peut.
Une solution pourrait être de remplacer tous tes espaces par   (espace insécable)...

Ou alors peut-être en mettant ce css :

white-space : no-wrap;

j'ai appliqué ta propriété CSS au même endroit que le overflow mais ça ne change rien

J'ai réussi grâce à toi mais j'ai fait d'autres recherches et voilà la réponse.

tr td{
   overflow : hidden;			
   white-space : nowrap;
}

Il n'y a pas de tiret dans nowrap et quand je l'ai remis le problème revenait.

Merci

Ah, désolé pour le tiret, je t'ai filé l'astuce de mémoire