0

誰かが助けてくれることを願っています。

私はJavaScriptの初心者です。名前のリストがあります。ホバーすると、その人の連絡先情報を含むボックスが表示されます。

私が抱えている問題は、ボックスの表示が速すぎることです。複数の名前にマウスを合わせると、ボックスが急速に起動します。

リンク: http://law.nd.edu/faculty/

関連するコードは次のとおりです。

<script>
jQuery(".directory-list li").hover(
function() {
  jQuery(this).find(".directory-info").fadeIn(200); ;
},
function() {
  jQuery(this).find(".directory-info").fadeOut(50);;
}
);
</script>

助けてくれてありがとう。

4

4 に答える 4

2

次のように setTimeout を使用して遅延を導入できます。

var hoverTimer;
jQuery(".directory-list li").hover(function() {
  var elem = jQuery(this).find(".directory-info");
  hoverTimer = setTimeout(function() {
    elem.fadeIn(200);
  }, 1000); // wait for one second and then fadeIn
},
function() {
  clearTimeout(hoverTimer);
  jQuery(this).find(".directory-info").fadeOut(50);
});
于 2013-04-03T20:10:35.503 に答える
2

最も簡単な方法は、fadeIn の前に遅延を追加することです。

jQuery(this).find(".directory-info").delay(300).fadeIn(200);
于 2013-04-03T20:10:35.627 に答える
1

このフィドルをチェックしてください。これがあなたが望むものだと思います。thisタイムアウトを使用する他の回答は、関数内のコンテキストを失い、setTimeout()機能しません。

http://jsfiddle.net/RZUVS/1/ .

于 2013-04-03T20:30:01.223 に答える