1

[編集]そこで、以下に提案するjavascriptツールチップの1つを使用しました。停止したときに表示したり、移動した場合に非表示にするためのヒントを入手しました。唯一の問題は、これを行うと機能することです。

document.onmousemove = (function() {
    var onmousestop = function() {
        Tip('Click to search here');
        document.getElementById('MyDiv').onmousemove = function() {
        UnTip();
    };
    }, thread;

    return function() {
        clearTimeout(thread);
        thread = setTimeout(onmousestop, 1500);
    };
})();

しかし、関数を特定のdivにのみ適用したいので、最初の行を "document.getElementById（'MyDiv'）。onmousemove =（function（）{"に変更すると、javascriptエラーdocument.getElementById（'MyDiv' ）はnullです私は何が欠けていますか.... ??

[/編集]

ユーザーが要素上で1.5秒以上停止したときに、バルーンスタイルのメッセージを表示したいと思います。そして、彼らがマウスを動かした場合、私は風船を隠したいと思います。私は、実際に投稿されているのを見つけたJavaScriptコードを使用しようとしています。マウスが停止したことを検出するために使用しているコードは次のとおりです。

document.onmousemove = (function() {
    var onmousestop = function() {
        //code to show the ballon
        };
    }, thread;

    return function() {
        clearTimeout(thread);
        thread = setTimeout(onmousestop, 1500);
    };
})();

だから私は2つの質問があります。1つは、カーソル位置に表示される推奨の軽量javascriptバルーンを持っている人はいますか。2つ目は、マウス停止の検出コードは正常に機能しますが、マウスが再び動き始めたことを検出してバルーンを非表示にする方法に困惑しています。ありがとう...

4

4 に答える 4

6

これに答えるには少し遅れますが、これは困っている人にとっては役に立ちます。

動画の上にカーソルを置いたときに HTML/JS プレーヤー コントローラーを非表示にするために、マウスの動きが一定時間停止したことを検出できるようにするために、この関数が必要でした。これは、ツールチップの修正されたコードです。

document.getElementById('MyDiv').onmousemove = (function() {
    var onmousestop = function() {
        Tip('Click to search here');
    }, thread;

    return function() {
        UnTip();
        clearTimeout(thread);
        thread = setTimeout(onmousestop, 1500);
    };
})();

私の場合、プレーヤー コントローラーの要素を選択するために jQuery を少し使用しました。

$('div.video')[0].onmousemove = (function() {
    var onmousestop = function() {
        $('div.controls').fadeOut('fast');
    }, thread;

    return function() {
        $('div.controls').fadeIn('fast');
        clearTimeout(thread);
        thread = setTimeout(onmousestop, 1500);
    };
})();
于 2010-03-04T18:04:54.593 に答える
3

jQueryプラグインhoverIntentは、同様の動作を提供します。ユーザーが特定の要素にカーソルを合わせるのが遅いかどうかを確認することで、ユーザーが特定の要素にカーソルを合わせるかどうかを判断し、要素にカーソルを合わせるのに一定の時間を費やします。

ユーザーが要素を離れたときにのみ「out」イベントが発生します。これは、探しているものとまったく同じようには聞こえませんが、コードは非常に単純です。

また、イベントを収集する必要がない場合は、mousemoveにバインドすることに注意してください。mousemoveは多くのイベントをすばやく発生させ、サイトのパフォーマンスに深刻な影響を与える可能性があります。hoverIntentは、カーソルがアクティブな要素に入ったときにのみmousemoveをバインドし、その後バインドを解除します。

hoverIntentを試してみると、縮小版で「アウト」イベントが発生しないという問題が発生したため、縮小されていない完全なソースを使用することをお勧めします。

于 2008-10-07T07:58:27.737 に答える
2

これは、ツールチップ上の素敵なフロート用の気の利いたjQueryプラグインです。

http://jqueryfordesigners.com/demo/coda-bubble.html

[編集]コンパニオンHTMLを見ずに、何が悪いのかを言うのは難しいと思います。要素がタグで指定された適切なIDを持っていることを再確認します。それとは別に、これが学術的な演習でない限り、上記で参照したjQueryプラグインのようなものを使用することをお勧めします。確かに、あなたが現在取り組んでいるすべての細かな点をすでに処理しているような、他の多くの構築済みツールがあります。

于 2008-10-06T16:49:41.550 に答える
1 
document.onmousemove = (function() {
  if($('balloon').visible) {
  //mouse is moving again
}....//your code follows

Prototype.js 構文を使用すると、バルーンが表示されるとマウスが移動したことを判断できます。

于 2008-10-06T16:58:43.700 に答える