鼠标移动jQuery视差移动元素

Question

我有一个小问题。我的代码，我在鼠标移动元素也移动X和Y轴。我想要得到的是让元素只在X轴上移动并停留在页面的底部。

我尝试删除Y轴命令的所有字符串，它停止移动元素Y轴，但居中元素 - 它的主要问题，我希望它停留在底部。

$(document).ready(function() { 
    var movementStrength = 25; 
    var height = movementStrength/$(window).height(); 
    var width = movementStrength/$(window).width(); 
    $("#top-image").mousemove(function(e){ 
     var pageX = e.pageX - ($(window).width()/2); 
     var pageY = e.pageY - ($(window).height()/2); 
     var newvalueX = width * pageX * -1 - 25; 
     var newvalueY = height * pageY * -1 - 50; 
     $('#top-image').css("background-position", newvalueX+"px  "+newvalueY+"px"); 

    }); 
}); 

谢谢。

Answer 1

我不确定我是否明白你想要做什么，但我认为你正在试图让＃top-image div保留在页面底部？如果是的话，你这条线围绕它的Y轴：

var pageY = e.pageY - ($(window).height()/2); 
var newvalueY = height * pageY * -1 - 50; 

如果你想它的底部，它应该是这样的：

var newValueY = e.pageY - yourImageHeight; 

但是，如果你正在使用背景位置，为什么不只是设置background-position-x，并保持background-position-y一样？

$('#top-image').css("background-position-x", newvalueX + "px");