0

マウスが上に移動したことを検出するjQueryでイベントを作成しようとしています。e.pageY イベントを使用しています。したがって、この場合、マウスの Y 位置が 2 未満のときにイベントが発生するようにします。これで成功しました。これがコードです。

$(document).mousemove(function(e){ 

    if (e.pageY <= 2){

       $('#mystuff').show();

    });

 });

問題は、ページを開いてマウスを下に移動すると、マウスが 2 未満の位置を通過するため、#mystuff が表示されることです。

マウスが上に移動していて下に移動していないときにのみ #mystuff を表示したい。

要点を理解していただければ幸いです。

ありがとう。

4

3 に答える 3

2

このようなことを試してください。

var mouseLastYPos = null;
$(document).mousemove(function(e){ 
    if(mouseLastYPos){ 
        if (e.pageY < mouseLastYPos && e.pageY <= 2){

           $('#mystuff').show();

        }
    }
    mouseLastYPos = e.pageY;
});​

実際のデモ - http://jsfiddle.net/bmHbt/

于 2012-04-27T14:32:27.307 に答える
1 
$(document).mousemove(function(e){ 
    var prevY = $('#mystuff').attr('data-prevY') || 0;
    if (e.pageY <= prevY){
       $('#mystuff').show();
    }
    else {
        $('#mystuff').hide();
    }
    $('#mystuff').attr('data-prevY', e.pageY);
 });

この JSFiddleを実際の例で確認してください。

于 2012-04-27T14:32:23.397 に答える
0

マウスがどちらの方向に動いているかを検出する組み込みの方法はないと思いますが、マウスの位置を保存し、前の位置と比較する非表示のフィールド値を使用して回避策を実行できます。次のようなものです。

if ($('#hiddenMousePos').val() > e.pageY){
    //Your code here
}
$('#hiddenMousePos').val(e.pageY);

のデフォルト値hiddenMousePosを 0 に設定します。これにより、前の e.pageY が実際よりも大きい場合にのみ条件に入ります。

于 2012-04-27T14:28:30.533 に答える