jQueryは、フォームがホバリングされたり入力ボックスがクリックされた場合にアニメーションを適用します。

マウスをホバリングしてエフェクトが消えない間に入力ボックスをクリックすると、フォーム全体に不透明効果を適用しようとしています。一方、#search-inputがクリックされた場合、それは場合にのみ、あなたがオーバーしていない作品現時点でjQueryは、フォームがホバリングされたり入力ボックスがクリックされた場合にアニメーションを適用します。

$('form#search').hover(function() { 
    $(this).stop().animate({"opacity": 1}); 
},function() { 
    $(this).stop().animate({"opacity": 0.6}); 
});

：

<form id="search"> 
    <input id="search-input" type="text" value="Search" /> 
    <input id="search-submit" type="submit" value="" /> 
</form>

そして、このjQueryの：私は、次のHTMLを持っている瞬間

マウスが画面の他の場所にある場合、この最終部分を追加するにはどうすればよいですか？

これは、親セレクタが存在しないため、入力のみがフォーカスされている場合に、フォーム全体に不透明効果を適用できないため、CSS3ではできません。

Pseduoコード決勝ゴール

$($('form#search').hover(), $('form#search input').focus()).functionOn(){ 
    $('form#search').stop().animate({"opacity": 1}); 
}, functionOff(){ 
    $('form#search').stop().animate({"opacity": 0.6}); 
});

出典

2012-05-09 Dan