1

私は頭を包むことができないというかなり基本的な質問があります(おそらくここは午前5時だからです)。次のように簡略化できます。

HTML:

<img src="image.jpg" alt="logo" />
<span class="caption">This is a caption</span>

JS:

$("img").mouseover(function() {
    $('.caption').show();
});

$("img").mouseout(function() {
    $('.caption').hide();
});

CSS を使用して、z-index プロパティと絶対配置を使用して、画像の上にキャプションを配置しました。問題は、ホバーするとキャプションが消え、マウスがまだ動いていると再び表示されるため、まばたきが発生することです。

明らかに、これは意図されたものではありません。基本的に、キャプション自体がホバーされているときに mouseover イベントを呼び出すべきではありません。誰かが修正しましたか?

4

1 に答える 1

1

これはどう:

HTML:

<div class="image_hover">
  <img src="image.jpg` alt="logo" />
  <span class="caption">This is a caption</span>
</div>

JS:

$(".image_hover").live({
  mouseenter: function() {
    $(this).find('.caption').show();
  },
  mouseleave: function() {
    $(this).find('.caption').hide();
  }
});
于 2011-09-19T03:07:12.673 に答える