Skip to content

Instantly share code, notes, and snippets.

@dustintheweb
Created October 13, 2018 19:13
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save dustintheweb/81f81db089eda2b21d26a3be3fc016df to your computer and use it in GitHub Desktop.
Save dustintheweb/81f81db089eda2b21d26a3be3fc016df to your computer and use it in GitHub Desktop.
Simple Parallax
const main = {};
const updateScroll = () => {
main.winScroll = $(window).scrollTop();
};
const parallaxLoad = () => {
const $someEl = $('.someEl');
$someEl.each((i,el) => {
let $el = $(el);
main.someEl[i] = $el;
});
}
const parallaxScroll = () => {
$.each(main.someEl, (i,$el) => {
$el.imgPos = (main.winScroll - $el.offset().top) / 20;
$el.css('transform', 'translateY(' + $el.imgPos + '%)');
});
}
// Compile
const load = () => {
parallaxLoad();
}
const scroll = () => {
updateScroll();
parallaxScroll();
}
// Events
$(window).scroll(() => {
scroll();
});
load();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment