Hola!
He encontrado un script que te va contando el número de caracteres que introduces en un textarea con una barrita de progreso y un contador.
Va bien si lo utilizas para un único textarea, pero si tienes varios en la misma página y en cada uno quieres incluir esta utilidad, ¿cómo podría hacerlo para que funcione? ¿Conocéis sino algún otro script que sirva para varios textarea?
Código:
<style type="text/css">
textarea {
width: 300px;
height: 200px;
}
#progreso {
background: url(textarea.png) no-repeat;
background-position: -300px 0px;
width: 300px;
height: 14px;
text-align: center;
color: #000000;
font-size: 8pt;
font-family: Arial;
text-transform: uppercase;
}
</style>
<script type="text/javascript">
var max=250;
var ancho=300;
function progreso_tecla(obj) {
var progreso = document.getElementById("progreso");
if (obj.value.length < max) {
progreso.style.backgroundColor = "#FFFFFF";
progreso.style.backgroundImage = "url(textarea.png)";
progreso.style.color = "#000000";
var pos = ancho-parseInt((ancho*parseInt(obj.value.length))/250);
progreso.style.backgroundPosition = "-"+pos+"px 0px";
} else {
progreso.style.backgroundColor = "#CC0000";
progreso.style.backgroundImage = "url()";
progreso.style.color = "#FFFFFF";
}
progreso.innerHTML = "("+obj.value.length+" / "+max+")";
}
</script>
</head>
<body>
<div class="contenedor">
<textarea onkeyup="progreso_tecla(this)" value=""></textarea>
<div id="progreso">(0 / 250)</div>
</body>
Gracias por adelantado
Saludos!