Bonsoir,

J'ai fais un formulaire de connexion et je voudrai que au moment d'écrire le value disparaisse et aussi que le cadre autour ne soi pas la j'ai complètement oublié comment faire.

Voici mon formulaire HTML :

<div id="form-de-co">
        <form action="" method="post">
              <input type="text" name="pseudo" value="Pseudo" size="" maxlength="250">
              <input type="password" name="pass" size="" >
              <input type="submit" value="go">

         </form>

et la partie CSS :

#form-de-co input[type=password]{
     border: none;
     width:155px;
     height:32px;
     color:#fff;
     background:url(img/searchField.png) top left no-repeat;
     padding:0px 10px 0px 10px;
     float:left;
}
#form-de-co input[type=text]{
     border: none;
     width:155px;
     height:32px;
     color:#fff;
     background:url(img/searchField.png) top left no-repeat;
     padding:0px 10px 0px 10px;
     margin-right:10px;
     float:left;
}
#form-de-co input[type=submit]{
     border: none;
     width:39px;
     height:32px;
     background:url(img/icn-go.png)center right no-repeat;
     cursor:pointer;
     font-family: "saved_by_zero_0-webfont";
     padding:2px 10px 0px 10px;
     color:#fff;     
     text-shadow: 0 0 0.5em #0b94a6, 0 0 0.5em #0b94a6,
        0 0 0.5em #0b94a6;
}

Le lien du projet en cour. je n'arrive vraiment pas a m'en souvenir comme vous avez l'air de savoir de quoi vous parler j'ai pas trouver mieux comme endroit pour cette demande.

6 réponses


Pewel-OutOfNutella
Réponse acceptée

Ah oui en effet, j'avais pas remarqué :/
C'est pas celui que j'avais vu il y a longtemps.

Bon après y'en a d'autres :D

celui là est pas mal
celui là aussi

Bonjour,

Tu parle de faire un placeholder ?

En HTML5 tu peux faire ainsi :

<div id="form-de-co">
        <form action="" method="post">

              <input type="text" name="pseudo" placeholder="Pseudo" size="" maxlength="250">
              <input type="password" name="pass" size="" >
              <input type="submit" value="go">

         </form>

Mais cela n'est compatible qu'avec les navigateurs supportant le HTML5

Autrement, il faut utiliser le javascript. Et si je ne me trompe pas, Graf a fait un tuto pour faire un system de placeholder : http://www.grafikart.fr/tutoriels/jquery/placeholder-jquery-164

Pour ce qui est du cadre, j'ai pas compris; Dsl

neecride
Auteur

Oui c'est bien cela placeholder merci ! pour le cadre je veut juste qu'il soi de la taille de la zone de texte.

salut
tu n'as pas de cadre (border) autour de tes input..

Pour les placeholder y'a ça aussi.

Après, l'histoire de ton cadre, je ne comprends pas trop ce que tu souhaite. Peut être qu'une capture pourrait nous aider.

@Pewel: Il a l'air pas mal ton JS mais je lui ai trouver un tout piti défaut, dans la démo en bas du site, il faut taper 2 lettres avant que le texte du placeholder disparaisse. Je chipotte un peu mais disont que j'aime quand c'est "parfait" dans le sens ou des que je tape 1 lettre sa efface le placeholder.

Pour ce qui est du screenshot, je suis pour :)