Webinventif

Voici encore un tout petit bout de code qui va bien améliorer vos champs de saisie.

Au cours de vos longue heure de surf, vous avez déjà très certainement croisé des champs de recherche pré rempli avec un petit texte gris, qui disparait lors d'un clic à l'intérieur ...

Et bien c'est ce que va faire Watermark Input Plugin en une ligne. Et oui, encore un script basé sur jquery (non je n'ai pas d'actions chez eux, juste que c'est mon framework préféré).

Mise en place:

• Comme d'habitude, on commence par inclure le framework jquery
  <script type='text/javascript' src='jquery.js'></script>
• Ensuite on intègre le Watermark Input Plugin
  <script type='text/javascript' src='jquery.watermarkinput.js'></script>
• Et vous initialisez les champs que vous voulez (Et vous pouvez précisez la couleur du texte par défaut )
  jQuery(function($){
        $("#champs1").Watermark("Recherche");
        $("#champs2").Watermark("Login","#369");  
  });
• Et donc il suffit juste de donner l'id correspondante à vos champs
  <input id="champs1" tabindex="1" type="text">
  <input id="champs2" tabindex="2" type="text">

La page de demo ...

Evidement c'est faisable pas trop difficilement même sans jquery, mais si vous l'utilisez déjà pour un autre de vos script, pourquoi s'en priver ?