DanyaQ
@DanyaQ
Entry web developer

Паралакс привязанный к мышке. Картинка движется даже при выходе за блок?

У меня паралакс работает даже когда я вышел за пределы блока. Как обездвиживать картинку при выходе на другой блок, тоесть когда мышка не находиться на блоке с background?!

<div class="background"></div>
.background {
	position: absolute;
	width: 100%;
	height: 100vh;
	background-size: 130% 130%;
	background-repeat: no-repeat;
	background-image: url(../img/background.jpg);
}

$(document).mousemove(function(e) {
    var x = (e.pageX * -1 / 5), y = (e.pageY * -1 / 5);
    $('.background').css('background-position', x + 'px ' + y + 'px');
});
  • Вопрос задан
  • 111 просмотров
Решения вопроса 3
lamer350
@lamer350
กำลังสูงสุด
$(document).mousemove(function(e) {
Как бы прочитав просто код можно понять что вы отслеживаете перемещения по документу, замените document на идентификатор вашего блока.
Ответ написан
rockfeeler
@rockfeeler
Фронтендер, дизайнер, верстальщик-перфекционист
Можно привязаться с границам блока, а не page. Например, через clientX и getBoundingClientRect.
Ответ написан
Комментировать
RAX7
@RAX7
$('.background').mousemove(function(e) {
    var x = (e.pageX * -1 / 5), y = (e.pageY * -1 / 5);
    $(this).css('background-position', x + 'px ' + y + 'px');
});
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы