Textareas escalables

Una de las funcionalidades mas interesantes y útiles que tiene el navegador de MAC Safari es la posibilidad de escalar los campos de texto o textareas, que te permite ingresar textos grandes y adaptar el campo de texto para visualizar adecuadamente el texto que se ingresa.

Firefox Resizeable Textarea
Resizeable Textarea es un plugin para Firefox creado por Raik Jürgens el cual te permitirá escalar los campos de texto de cualquier página web de manera sencilla y sin configuraciones adicionales. Si eres usuario de Firefox te va a ser de mucha utilidad pues va a poder ingresar datos en los formularios de forma mucho mas sencilla, rápida y entendible.

Mootools Textarea Resizer
Textarea Resizer es un plugin para Mootools que permitirá hacer que todos tus campos de texto sean escalables, para ello primero descargas resizeTextarea.js, luego lo incluyes junto a Mootools al inicio de la página donde deseas permitir el escalado de textareas de la siguiente forma:

  1. <script src="mootools.js" type="text/javascript"></script>
  2. <script src="resizeTextarea.js" type="text/javascript"></script>

Pueden ver un ejemplo de este método funcionando en: textarearesizer.html.

jQuery Auto Growing Textareas
Auto Growing Textareas es un plugin para jQuery que permite el escalado de textareas, para ello lo primero es incluir las librerías jquery.js, jquery.autogrow.js y luego aplicamos el método autogrow a todos los textareas que deseamos.

  1. <script type="text/javascript" src="jquery.js"></script>
  2. <script type="text/javascript" src="jquery.autogrow.js"></script>
  3. <script type="text/javascript">
  4. $(document).ready (function() {
  5.     // para todos los textareas
  6.     $('textarea').autogrow();
  7.     // para textareas con clase resize
  8.     $('textarea.resize').autogrow();
  9. });

Pueden ver varios ejemplos funcioando en: Auto-Growing Textarea Demo.

Comentarios Total 5 comentarios


Emilio
Publicado: 19/04/2008 7:24 pm

El jQuery Auto Growing Textareas esta bueno ;)

En cuanto al de MooTools, pues el ejemplo que muestras de tu servidor no sirve :S Ni siquiera le veo los botones de agrandar que hay en http://ejectmedia.net/examples/moo_textareas/index.php

Un Saludo!

Derleth
Publicado: 21/04/2008 12:21 pm

ahaha esto es nuevo para mi, no lo habia visto, muy util para hacer formularios dinamicos :D tan buenos post como siempre, y por cierto el ejemplo que pones: “textarearesizer.html” no funca te falto alguito, pero es muy buena la intencion ^^

Pau
Publicado: 23/11/2009 6:44 am

Sólo quería comentarte que el enlace a la última demo (cuando dices “Pueden ver varios ejemplos funcioando en:”) está reportado como página atacante y firefox la bloquea. Por si quieres cambiarlo.

Gracias por el artículo y un saludo :-)

unijimpe
Publicado: 23/11/2009 8:31 am

Gracias por reportar el URL, esta dirección es del autor original del script por que es recomendable descargar este ejemplo desde http://plugins.jquery.com/project/autogrow

cristian
Publicado: 06/02/2014 2:54 pm

Realmente todo lo que esta aqui es de mucha ayuda felicitaciones!!!
Amigo tienes algo donde se utilizen combo box(select) los cuales sean anidados y que se rellenen desde la base de datos.

Seria de gran ayuda Saludos

 

Comentar

En este blog los comentarios están moderados, serán mostrados cuando el administrador los apruebe. Por favor, evita comentarios ofensivos u obscenos por que no serán aprobados.
Si deseas publicar código fuente debes hacerlo entre las etiquedas <code> y </code>, además debes reemplazar los carácteres < por &lt; y > por &gt;.

(Requerido)

(Requerido, no será publicado)

(Requerido)

(Tags aceptados: <a> <em> <strong> <code> <ul> <li>)