javascript - マウスの方向を検出する

Question

マウスの方向が上か下かを検出するために、このコードを試しています。

<html>  
    <head></head>
    <body>
        <div style="width: 500px; height: 500px; background: red;"></div>
    </body>
</html>

var mY = 0;
$('body').mousemove(function(e) {
    mY = e.pageY;
    if (e.pageY < mY) {
        console.log('From Bottom');
        return;

    } else {
        console.log('From Top');
    }

});

ただし、このコードは機能しません。コンソールログは常に「上から」と表示されます

何か案が？

デモ

score 11 · Accepted Answer

var mY = 0;
$('body').mousemove(function(e) {

    // moving upward
    if (e.pageY < mY) {
        console.log('From Bottom');

    // moving downward
    } else {
        console.log('From Top');
    }

    // set new mY after doing test above
    mY = e.pageY;

});

score 4 · Accepted Answer

比較する前に設定my = e.pageYします。つまり、比較は常に等しくなります (したがって false になります)。

このようにしてみてください

var mY = 0;
$('body').mousemove(function(e) {

    if (e.pageY < mY) {
        console.log('From Bottom');

    } else {
        console.log('From Top');
    }
    mY = e.pageY;

});

score 1 · Accepted Answer

1

e.pageYステートメントの直前にmY設定mYするため、常に等しいです。e.pageYif

于 2011-12-09T18:50:01.223 に答える

score 0 · Accepted Answer

mY方向を決定した後に値を設定する必要がありました(以前は値を設定していたため、常に特定の結果が返されていました)。

コード：

//Values starts at middle of page
var mY = $('window').height()/2;

//Compares position to mY and Outputs result to console
$('body').mousemove(function(e) {
    if (e.pageY < mY) {
        console.log('Going Up');   
    } 
    else {
        console.log('Going Down');
    }
    mY = e.pageY;
});

実施例

score 0 · Accepted Answer

if/else を使用すると、e.pageY == mY であっても、常に「Going Down」が出力されます。

代わりに 2 つの if ステートメントを使用してください。

var mY = 0;
$('body').mousemove(function(e) {

// moving upward
if (e.pageY < mY) {
    console.log('From Bottom');

// moving downward
}
if (e.pageY > mY) {
    console.log('From Top');
}

// set new mY after doing test above
mY = e.pageY;

});

macek からコードをコピーし、「else」を「if(...)」に置き換えただけです。

score 0 · Accepted Answer

それを行う最も簡単な方法。このようにして、方向の変化を検出できます。

var tempMouseY=0;
$('body')
.mousemove(function(e) {
    moveY = -(tempMouseY-e.pageY);
    tempMouseY = e.pageY;
    if (moveY<0) {
        console.log('From Bottom');
    } else {
        console.log('From Top');
    }

 });

javascript - マウスの方向を検出する

6 に答える 6

Related

Reference