определение направления мыши

Я пытаюсь этот код, чтобы определить, идет ли направление мыши вверх или вниз: 

<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');
    }

});

Однако этот код не работает был я ожидаю. Журнал консоли всегда показывать "сверху"

Есть идеи ?

Демо

6 4
javascript jquery mouseevent

6 ответов:

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;

});
9

Вы устанавливаете my = e.pageY перед его сравнением, что означает, что сравнение всегда будет равным (и, следовательно, ложным.)

Попробуйте вот так 

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

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

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

});
4

e.pageY всегда равно mY, потому что вы устанавливаете mY в e.pageY непосредственно перед оператором if.

1

Вам нужно было установить свое значение 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;
});

Рабочий Пример

0

Если вы используете if / else, он всегда будет выводить 'Going Down', даже если e. pageY = = mY.

Вместо этого используйте 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(...) 'кстати

0

Самый простой способ сделать это. Таким образом, вы можете обнаружить изменения направления:

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');
    }

 });
0