0


0

私はこの「jQuery」コードを使って、「em」タグを上に、上に、上に、下にスライドさせています。

$( "。エントリa")。hover(function(){$(this).find( "em")。animate({height: "100%"}、500)

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

HTMLコード

説明

説明説明

マウスをタグの外側に移動すると、emタグが数ピクセル下にジャンプしてからスライドし始めます。 これは一種の遅れ効果を生み出します。

これを書くもっと良い方法はありますか?

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

パフォーマンスとコードスタイルのためのどんなヒントでも非常に高く評価されるでしょう。

2 Answer


1


これを使用してみてください、私はそれがあなたがしようとしていることの効果であると思い、そしてそれは滑らかな移行を使用しています。

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

編集:本当に効率的なものが必要な場合は、選択のためにjQueryを避け、 ` $(this.childNodes [1])`を使用して選択することもできます。 + ` [1] +`は、空白が要素0であるためです


0


特定の問題に対する直接的な回答ではありませんが、JQueryのUIを検討することをお勧めします。 それはあなたがここで試みたものと同様のアニメーション効果を持ちます。