Script javascript: Textarea ridimensionabile con jquery

difficoltà:

Script simili
27/10/2008

Vediamo come creare molto facilmente una textarea ridimensionabile con jquery. Basterà usare jquery e la libreria jquery.ui e in poche righe avremo la nostra textarea resizable.

Fortunatamente tra l'altro sia jquery che jquery.ui sono librerie hostate sui server di google, per cui non dovremo ne scaricarle ne tantomeno far caricare le librerie dai nostri server (con un bel risparmio di banda);

Includeremo quindi le librerie a inizio script utilizzando le api ajax di google vedi spiegazione nell'articolo:
Script ajax: Caricare librerie ajax dai veloci server di google:

<script src="http://www.google.com/jsapi"></script>
<script>
google.load("jquery", "1.2.6");
google.load("jqueryui", "1.5.2");
</script>

Vediamo ora lo script completo:

<script src="http://www.google.com/jsapi"></script>
<script>
google.load("jquery", "1.2.6");
google.load("jqueryui", "1.5.2");
</script>
<script>
$(document).ready(function() { 
	$("#resizebleTextarea").resizable({ 
	    handles: "e,s", 
	    minWidth: 200, 
	    minHeight: 100, 
	    maxWidth: 400, 
	    maxHeight: 400 
	});
 }); 
</script>

<textarea id="resizebleTextarea">Contenuto textarea ridimensionabile</textarea>

Basterà semplicente settare le proprietà come desiderate:
handles: accetta: all,n,s,e,w identifica i lati della textarea che sarà possibile spostare per ridimensionarla. Stanno per: tutti, nord, sud, est, ovest. Si possono indicare più lati separandoli da virgola. Nel mio caso voglio solo spostare il lato destro e quello sotto(est e sud).
minWidth, minHeigh, maxWidth, maxHeight: sono l'altezza e la larghezza minima e quelle massime in pixel. Se mettiamo minWidth e maxWidth uguali potremo solo allungare la textarea senza variare la larghezza.
Per altre opzioni vedere:

http://ui.jquery.com/repository/latest/demos/functional/#ui.resizable

Social:

Donazione:

Se questo script ti grave; stato utile e ti ho fatto risparmiare tempo e denaro fai una qualsiasi cifra è ben accetta! 1€, 3€, 5€ ,10€, 50€ ;-) fai te!