La etiqueta HTML: label, es un acompañante de los controles del formulario. Mediante InputLabel, un plugin de jQuery, se muestra el contenido de la etiqueta label dentro del la caja de texto ó control de formulario input, dando un aspecto más atractivo a nuestros formularios.

Un ejemplo de código, tradicional con label:

<label for="myInput">Nombre de la persona</label>
<input id="myInput" type="text" name="myInput"/>

Resultado:

Input label demo

Haciendo uso del plugin InputLabel, el resultado:

Plugin jQuery InputLabel

Ahora que sabemos que es lo queremos decir, veamos cómo usar este plugin. Descargar el plugin (obviamente debemos tener la líbreria jQuery también).

Luego de incluir la referencia, debemos especificar a que controles afectaremos con el plugin.

<script type="text/javascript" src="../js/jquery-1.2.6.min.js"></script>
<script type="text/javascript" src="../js/jquery.inputlabel.js"></script>
<script type="text/javascript">
$(function () {
//por defecto
$("#myInput").inputLabel();

//agregar texto por defecto
$("#myInput").inputLabel("Custom label text");

//tomar texto de otra etiqueta
$("#myInput").inputLabel($("#header h1"));

//dar formato al texto
$("#myInput").inputLabel(false,{keep:false});
$("#myInput").inputLabel(false,{color:"#F00"});
$("#myInput").inputLabel(false,{force:true});

//aplicar efecto a más de un input
$("#myInput1",#myInput2").inputLabel(false,{force:true});
});
</script>

En la parte del body:

<form>
<label for="myInput">Enter a value</label>
<input type="text" name="myInput" id="myInput" />
</form>

Más detalles …