1

ユーザーがテキストにカーソルを合わせると、その div の下にいくつかのリンクが隣り合って表示されるようにします。ただし、テキストを含む Div をマウスアウトすると、リンクがすぐに消えてしまいたくありません。今、CSS の遅延について読んだことがありますが、IE はこれをサポートしていないようです。HoverIntent についても準備はできていますが、Jquery に関してはあまり得意ではありません。私を助けてくれる人、または出会ってくれる人はいますか? 私のHTML：

 <div id="text"><a href="" class="hoverlink">My text</a></div>

 <a href="">Link1</a>
 <a href="">Link2</a>

「マイテキスト」にカーソルを合わせると2つのリンクが表示され、マウスアウトで消えますが、遅れますか? ヘルプ？！

どうもありがとう！サンダー

4

3 に答える 3

1

いくつかの変更を加えて

HTML

<div><a href="" class="hoverlink">My text 1</a></div>
<div class="links">
    <a href="">Link-1</a>
    <a href="">Link-2</a>
</div>

JS

​$(function(){
    var timeOut=0;
    $('.hoverlink').on({
        'mouseenter':function(){
            $(this).parent().next('.links').show();
        },
        'mouseleave':function(){
            var next=$(this).parent().next('.links');
            timeOut=setTimeout(function(){
                next.hide();
            }, 1000);
        },
    });

    $('.links').on({
        'mouseenter':function(){
            clearTimeout(timeOut);
        },
        'mouseleave':function(){
            $(this).hide();
        }
    });
});​

デモ。

于 2012-11-14T00:01:16.080 に答える
0

始めましょう：

  1. jQueryはじめに
  2. jQueryセレクター
  3. jQueryイベント
  4. jQueryトグル
于 2012-11-13T23:45:53.990 に答える
0

私が欲しいものを実際に説明する素晴らしいチュートリアルを見つけました：

http://www.thatsquality.com/articles/creating-delayed-drop-down-menus-in-jquery-without-losing-accessibility

質問はクローズアップできます！ありがとう、サンダー

于 2012-11-13T23:48:47.217 に答える