Modification des propriétés CSS sur focus

Est-il un moyen de modifier le CSS de la frontière d'un div, lorsqu'un champ de saisie obtient le focus (par exemple, lorsqu'il perd le focus, supprimer la bordure).

HTML:

<input type="text" name="title" id="title"></input>
<div id="mainTitle">The Main Title</div>

CSS:

#mainTitle {
    border: 1px solid #ccc; 
}

OriginalL'auteur getaway | 2010-11-13

  1. 10
    $(function() {      //aka document.ready
    $("input#title").focus( function() {
        $("div#mainTitle").css("border","1px solid #ccc");
    });

    $("input#title").blur( function() {
        $("div#mainTitle").css("border","");
    });
});

    OriginalL'auteur Gordon Gustafson

  2. 3

    Vous pouvez simplement utiliser le css, si vos utilisateurs travaillent dans une manière compétente navigateur (donc, pas IE, pour la plupart):

    input:hover + #mainTitle,
input:focus + #mainTitle,
input:active + #mainTitle {
   border: 2px solid #ccc;
}
    la plupart de mes utilisateurs utilisent IE lol, :)) je souhaite que serait le travail c'est à dire :((

    OriginalL'auteur David Thomas