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

私はあなたが何をしようとしているのかよく分かっていませんが、ページの下部に＃トップ画像の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");