5568 sujets

Sémantique web et HTML

Changement de taille d'un textarea en présence du texte

Bonsoir,
j'ai un petit formulaire avec un textarea, et j'aimerais que dans le même genre que Facebook, il détecte la présence de texte pour définir sa taille. Attention ! Je ne veux pas un textarea qui s'adapte à la longueur du texte comme sur Twitter, mais qui adopte une taille fixe lors de la présence de texte, voilà, je pense que c'est possible en html, j'aimerais éviter d'utiliser du javascript.

Voilà, merci à vous !
En html5 et css3 (attribut required obligatoire) :

<textarea name="texteaenvoyer" placeholder="Votre texte ici…" required></textarea>



		textarea {
			width: 30em;
			height: 5em;
		}
		textarea:invalid {
			height: 1em;
		}
		textarea:focus {
			height: 5em;
		}

Modifié par Patidou (08 Sep 2012 - 12:21)
Merci, c'est exactement ce que je voulais. Mais je venais juste avant que tu poste ceci de trouver un plugin Jquery qui joue avec la taille du textarea selon la longueur du texte (ce dont j'ai dis que je ne voulais pas ^^), désolé de vous avoir fais perdre votre temps, j'aurai au moins appris cette pseudo-classe ":invalid" que je ne connaissais pas jusqu'à présent !
L'avantage ici c'est que ça fonctionne sans js, pas besoin d'alourdir la page avec des plugins inutiles (sauf si on veut tenir compte des anciens navigateurs mais là avec les commentaires conditionnels on est sauvés).
Je suis également assez retissant au js, j'attend avec impatience le jour ou l'on pourra indiquer height:auto; sur un textarea pour qu'il s'adapte tout seul au texte !!
J'aurais une question à propos d'un autre sujet, j'ai déjà eu une affaire de ce type et j'avais été obligé d'avoir recours au javascript, peut-être que tu en sais plus:

Peut-on transmettre une informations d'un enfant vers son père, et entre deux frères. par exemple:


<div id="père">
	<div id="frère1"></div>
	<div id="frère2"></div>
</div>




#frère1:hover #père {
	background:#000;
}

#frère2:hover #frère1 {
	background:#fff;
}


Moi même je n'y crois pas mais être y-a-til un moyen aujourd'hui...
xXjujo002Xx a écrit :
Moi même je n'y crois pas mais être y-a-til un moyen aujourd'hui...
Misons sur demain, ou après demain Smiley cligne
Salut,

Pour le père, à ma connaissance, non.
Pour le frère, pas de souci via les sélecteurs d'adjacence.
Exemple avec adjacent direct

Merci à Patidou pour le truc. À noter qu'il est important de déclarer le :focus après l':invalid (ou que, à tout le moins :focus soit prioritaire sur :invalid).

tm
Sujet clos
Aller à