Discussion :

[Calvein]

Mon titre n'est pas très explicite mais j'aurai aimé trouver un script de ce genre.

J'ai mon petit cadre, un <div> en gros, de ce style :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 ___
|   |
|___|

Et lorsque je le rempli en javascript, il se déforme pour prendre une autre taille, comme ceci :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
 
 ________
|       |
| Image |
|       |
| Texte |
|       |
|_______|

Merci

[le_chomeur]

le problème est qu'il te faut une taille fixe au moins en largeur car le texte s'adapte a son conteneur

[Calvein]

Oui oui je sais, j'ai pas été assez explicite en fait.

J'aurai aimé que le div s'agrandisse mais avec un effet, par exemple, il s'adapte en largeur, puis en longueur et enfin affiche le contenu

[le_chomeur]

lol si j'ai bien compris

Mais il faut connaitre la largeur du texte ... la hauteur peut se gèrer mais pas la largeur ...

pour l'effet c'est faisable sinon ...

[marcha]

Salut,

Ce que tu peux essayer c'est de remplir un div caché avec ton nouveau contenu,
puis tu en mesure la largeur et la hauteur. (clientWidth et clientHeight)

ensuite tu contraints les deux dimensions de ton div (où tu veux injecter le nouveau contenu) avec sa taille actuelle puis avec un setInterval tu modifies
ses dimensions pour atteindre celles de la nouvelle taille.

Tu peux décider d'afficher le nouveau contenu que lorsque le div a la bonne
taille. Si tu le fais avant il n'y aura probablement pas la place et tes textes
passeront à la ligne et se réorganiseront en cours d'animation, cela risque de
produire un effet visuel par terrible. Le contenu débordera de ton div si il n'a
pas la place.

Tu peux envisager d'imbriquer deux div, celui de l'extérieur serait en overflow
hidden et celui de l'intérieur aurait les dimensions finales, ainsi pendant l'anim
du div extérieur, le div intérieur (si il a déjà les dimensions finale) sera simplement
"clippé" et ça devrait donner un meilleur effet.

[le_chomeur]

+1 avec marcha , a une exception faite , si je ne dis pas de bétise , lorsqu'un élément est en style.display.none, on ne peut récupérer sa taille/hauteur :-/