Search jQuery

jQuery Forum

in Using jQuery • 10 years ago

Hi,

I'm building a parralax website.
When scrolling vertically, the objects change position vertically too.

But I want one image to change horizontally when scrolling vertically.

So i probably need to change some code but I don't know where to start?

I tried this but than it goed diagonally not vertical :s
taxi.css({'backgroundPosition': newPosHorizontal(50, windowHeight, pos, 2600, 0.6)});

This is the code:

//if the second section is in view...

if($secondBG.hasClass("inview")){

//call the newPos function and change the second background position

taxi.css({'backgroundPosition': newPos(50, windowHeight, pos, 2600, 0.6)});

function RepositionNav(){

var windowHeight = $window.height(); //get the height of the window

var navHeight = $('#nav').height() / 2;

var windowCenter = (windowHeight / 2);

var newtop = windowCenter - navHeight;

$('#nav').css({"top": newtop}); //set the new top position of the navigation list

}

//function that is called for every pixel the user scrolls. Determines the position of the background

/*arguments:

x = horizontal position of background

windowHeight = height of the viewport

pos = position of the scrollbar

adjuster = adjust the position of the background

inertia = how fast the background moves in relation to scrolling

function newPos(x, windowHeight, pos, adjuster, inertia){

return x + "% " + (-((windowHeight + pos) - adjuster) * inertia) + "px";

}

//function to be called whenever the window is scrolled or resized

function Move(){

var pos = $window.scrollTop(); //position of the scrollbar