Skip to content

Instantly share code, notes, and snippets.

@mgussekloo
Created August 21, 2017 15:07
Show Gist options
  • Select an option

  • Save mgussekloo/71acf8558621f2695f43c816980abe28 to your computer and use it in GitHub Desktop.

Select an option

Save mgussekloo/71acf8558621f2695f43c816980abe28 to your computer and use it in GitHub Desktop.
Parallax scrolling
// scroll
var parallaxEmts = $("[data-parallax]");
for (var x=0,max=parallaxEmts.length;x<max;x++) {
var emt = $(parallaxEmts[x]);
emt.data("page-y", emt.offset().top);
};
function parallax() {
if (documentIsHidden()) return;
var yPos = window.pageYOffset;
var ww = $(window).width();
for (var x=0,max=parallaxEmts.length;x<max;x++) {
var emt = $(parallaxEmts[x]),
windowHeight = $(window).height(),
emtTop = emt.data("page-y");
if (emtTop == null) {
emtTop = emt.offset().top;
emt.data("page-y", emtTop);
}
var dist = (windowHeight / 2) - (emtTop - yPos),
speed = (emt.data("parallax") == "slow") ? 0.05 : 0.1;
// disable for mobile
if ( ww <= 992 ) {
dist = 0;
emt.removeData("page-y");
}
emt.css({"transform": "translateY(" + (-dist * speed) + "px)"})
}
}
$(window).scroll(parallax);
$(window).resize(parallax);
parallax();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment