jQuery Label Better vi permetterà di creare delle label semplici e accattivanti per i campi di input dei vostri form.
Per utilizzare questo plugin non dovete fare altro che includerlo nella vostra pagina e aggiungere dei “placeholder text” che compariranno poi come etichetta dei campi da compilare solo nel momento in cui l’utente ne ha bisogno.
Per utilizzarlo è sufficiente includere l’ultima libreria jQuery insieme jquery.label_better.js nel vostro documento, e semplicemente chiamare la funzione come questa:
$ ( "input.label_better" ).label_better ({
posizione: "top" , // Questo vi permetterà di definire la posizione in cui apparirà l'etichetta quando l'utente fa clic sui campi di input opzioni accettabili sono "top","bottom","left","right". Valore predefinito è "top".
animationTime: 500 , // Questo vi consente di controllare la velocità di animazione in cui compare l'etichetta Questa opzione accetta un valore in millisecondi Il valore di default è 500.
easing: "ease-in-out" , . // Questa opzione ti consente di definire il CSS easing con cui animare la label.
offset: 20 . // È possibile aggiungere più spazio tra il campo di input e la label corrispondente. Questa opzione accetta valore in pixel (senza unità). Il valore predefinito è 20.
});
Compatibilità
I browser moderni come Chrome, Firefox e Safari (sia su desktop che su smartphone) sono stati testati.
Non ho ancora testato su IE.
Per maggiori informazioni vi rimando al link del plugin.