Forum Clubic

Modifier script Textarea > Pre

Logiciel Programmation
#1

Hello, sur le net j’ai trouvé ceci :

<textarea cols="70" rows="3" id="boite2">citation de code</textarea><br />


<a onclick="javascript:document.getElementById('boite2').focus();document.getElementById('boite2').select();">Séléctionner tout</a>

Ce qui fait que ce lien fait sélectionner tout le contenu du textarea.

J’ai voulu intégrer ceci sur mon site, mais moi ce n’est pas un textarea mais un 

 que j’utilise pour citer mon code.

L’ennui est qu’il ne le sélectionne pas le contenu du 
 mais le contour de cette balise :S

Comment adapter ce script pour ma balise pre ?


Bonne journée !


Amicalement :slight_smile:
#2

Tu sais, tu peux utiliser un textarea, et avec les css, lui donner l’aspect d’un pre. Ce n’est pas plus compliqué que cela.

Sinon tu peux résoudre ton problème initial avec DOM et l’interface document.createRange(). Je crois que ça sert à ça, je n’en suis pas sûr.

cf. developer.mozilla.org…

N’oublie pas de poster tes avancées si tu bosses avec createRange(), ça m’intéresse

#3

Effectivement, je pourrais remplacer mes pre par des textarea.

L’ennui est qu’il me faut spécifier a chaque fois les cols et rows pour la taille du textarea.

n’y a t’il pas un moyen que le textarea s’affiche comme sur mon site à cette page ?

En fait il faudrait qu’il s’adapte automatiquement en hauteur et en largeur comme mon pre.

Comment faire ?

#4

Ben regarde createRange() :slight_smile:

Sinon, apprends les css. Si tu utilises width: 100% ça devrait à peu près fonctionner.

#5

Je connais le css :wink:

J’ai mis ceci :

.code textarea {
	width: 100%
}

Et ceci en html :

<textarea readonly="readonly" id="boite2" class="code">
citation de code php ou autre
?>
</textarea>

Mais voici ce que ca donne :

www.jeoffrey54.com…

#6

Pas étonnant :slight_smile: c’est textarea.code ou alors :

Ca:

citation de code php ou autre ?>

Et:

div.code {} /* recopie ton style de base pour pre */
div.code textarea {width: 100%; border: 0;}

Un des défauts de CSS c’est que tu n’as pas la possibilité d’évaluer des expressions.

#7

Voila ce que j’ai mis dans le css :

div.code {
	font-family: Courier, 'Courier New', sans-serif;
	font-size: 11px;
	color: #006600;
	background-color: #FAFAFA;
	border: #D1D7DC;
	border-style: solid;
	border-width: 1px;
	margin: 1em;
	padding: 1em;
}

div.code textarea {width: 100%; border: 0; color: #006600;}

Et regarde ce que ca donne :

www.jeoffrey54.com…

Pour la largeur ca va, mais pour la hauteur ?

Et ce n’est plus valide car je ne spécifie pas les rows & cols.

Sinon, n’y avait t’il pas moyen de modifier mon premier script que j’avais trouvé (cf premier post) pour l’adapter a mon pre ou a un div ?
Edité le 13/08/2007 à 16:51

#8

Pour ta seconde question, oui. En utilisant éventuellement l’API DOM et donc en faisant une recherche (ce que je t’ai dis tantôt).

Pour l’autre question, non. Disons que la hauteur d’un textarea dépend de son nombre de “rows”.

#9

L’API DOM ? Je connais pas du tout, et je ne maitrise pas le Javascript :S

#10

Moi pas plus que toi:)

Et si tu veux faire le même effet qu’un pre avec textarea, tu sera limité sur la hauteur. Essaye éventuellement display: block; white-space: pre; mais ensuite je peux pas t’aider plus.

#11

Ouais, jvais un peu me renseigner pour l’API DOM, histoire de voir a quoi sa sert :wink:

Merci Sans-Nom :slight_smile: