Как реализовать движения бэкграунда за курсором?

Question

[SolidSnake13]

Как реализовать движения бэкграунда за курсором? Мне нужно вот такое поведение фона:

https://github.com/user-doesnt-exist/page-doesnt-exist

Мне важно понять в сторону каких событий, методов и т.д. смотреть. Хочу реализовать такое на обычном JS.

Comments

[SolidSnake13]

Без всяких библиотек.

[Froggyweb]

SolidSnake13, на js считываешь координаты мыши и в нужной пропорции двигаешь картинку :)

[SolidSnake13]

Примером является сама ошибка 404 на Гитхабе. То есть то как двигаются картинки в зависимости от движения курсора.

Answer 1

[RomanKudlatov]

Пример не смог открыть но что то накидал, как я понял, нужно сделать подобие параллакса? Только для бг в стилях надо задать position

var bg = document.querySelector("#bg");

window.onmousemove = e => {
  x = e.offsetX;
  y = e.offsetY;

  bg.style.left= x/30+"px"
  bg.style.top= y/30+"px"
}

Comments

[lonelymyp]

пример как раз и есть та страница с ошибкой :)