1

私は現在 MVC3 を学習しており、学習プロセス中にいくつかの jQuery スクリプトをプロジェクトに追加し、同時にそれを学習しようとしています。物事は順調に進んでいますが、この場合、必要な機能を実現するために何をしなければならないかを正確に理解できないようです.

コードをいくつかのコード ブロックに分けてここに記述するのではなく、この Fiddleで関連するコードのサンプルを作成しました。

私のコードで何が起こるかというと、ボタンを押すと、メッセージ div が左からスライドし、3 秒後に再びスライドします。メッセージ div がスライドアウトされているときにユーザーがマウスをメッセージ div の上に置くと、メッセージが追加されます。

これは、1 つの小さな追加を除いて、私が望んでいることのほとんどです。ユーザーがマウスをメッセージ div の上に置くと、マウスを離すまで開いたままにしておき、その後スライドして戻ります。現在、3 秒が経過した後もスライドします。

.delayイベントにコードを追加して移動しようとしましたmouseout()が、jQuery の知識が不足しているため、ここでの進行がほとんど止まってしまいました。

誰かがこれを行う方法を説明したり、いくつかの例を教えてくれませんか.

どうもありがとう。

4

2 に答える 2

1

表示機能でクリア（したがって3秒の遅延）を呼び出すため、次のマウスオーバー/マウスアウトハンドラーをお勧めします。

$("#messageWrapper").mouseover(function() {
    $("#testlabel").text("mouseover");
    $("#messageWrapper").css('width', 'auto');
    $("#messageWrapper .messageBox").text(something);
    $(this).clearQueue();
}).mouseout(function() {
    $("#testlabel").text("mouseout");
    clearMessages();
});

フィドルの編集: http://jsfiddle.net/vypTA/7/ - 明確な遅延を微調整できると思います (引数などとして渡します)

于 2012-09-19T11:50:39.657 に答える
0

これはあなたが達成したいことですか？

$("#messageWrapper").mouseover(function() {
    $("#testlabel").text("mouseover");
    $("#messageWrapper").css('width', 'auto');
    $("#messageWrapper .messageBox").text(something);
    $("#messageWrapper").stop(); // added this line
}).mouseout(function() {
    $("#testlabel").text("mouseout");
    clearMessages(); // added this line
});
于 2012-09-19T11:45:52.723 に答える