jQueryのは、私がダウンしてぼかしのホバー上で、「EM」タグのアップをスライドさせ、このjQueryのコードを持っているし、問題

Question

をアニメーション：

$(".entries a").hover(
    function() { 
    $(this).find("em").animate({ height:"100%"}, 500) 

    }, 
    function() { 
    $(this).find("em").animate({ height:"0%"}, 500) 
    } 
); 

htmlコード

<div class="entries"> 
<a href="http://www.website.com"> 
<em>Description</em> 
<img src="thumb.jpg"/> 
</a> 
<a href="http://www.website.com"> 
<em>Description</em> 
<img src="thumb.jpg"/> 
</a> 
<a href="http://www.website.com"> 
<em>Description</em> 
<img src="thumb.jpg"/> 
</a> 
</div> 

を私は外で私のマウスを移動するとaタグ、emタグは数ピクセル下がってからスライドし始めます。これは、一種の遅れの効果を作り出します。

これを書き込むより良い方法はありますか？

varを使って$（this）.find（ "em"）をキャッシュするのと同じですか？

パフォーマンスとコードスタイルのヒントは非常に高く評価されます。

Answer 1

これを試してみてください。それはあなたが進めている効果だと思いますし、よりスムーズなトランジションを使用しています。

$(".entries a").hover(
    function() { 
    $(this).find("em").slideDown(500); 
    }, 
    function() { 
    $(this).find("em").slideUp(500); 
    } 
); 

編集：
あなたが本当に効率的な何かをしたい場合、あなたは選択のためのjQueryを回避し、それを選択するために、$(this.childNodes[1])を使用することができます。
[1]は空白が要素なので0

Answer 2

JQuery UIを調べることをお勧めします。ここで試したのと同じようなアニメーション効果があります。