Изменение изображения с помощью позиций мыши

У меня есть изображение в верхней части моей страницы, и я хочу, чтобы оно менялось со стационарного на левое, а затем правое в зависимости от положения мыши на странице. Помогите мне, пожалуйста

1 ответ

Решение

Лучше всего использовать mousemove функции на документе, а затем отслеживать местоположение мыши с помощью параметра события.

Вот пример JSFiddle.

$(document).mousemove(function(event){
    var mloc = {
        x: event.pageX,
        y: event.pageY
    };

    if( 
        (mloc.x >= 0 && mloc.x <= $(document).width()/2) &&
        (mloc.y >= 0 && mloc.y <= $(document).height()/2)
    ){
        //In upper left corner
        //Do stuff
    }else if( 
        (mloc.x >= $(document).width()/2 && mloc.x <= $(document).width()) &&
        (mloc.y >= 0 && mloc.y <= $(document).height()/2)
    ){
        //In upper right corner
        //Do stuff
    } //etc
}); 

Вот учебник по отслеживанию мыши.
Вот целая куча доступных событий.

В частности, вот pageX а также pageY,

Другие вопросы по тегам