Skip to content

Instantly share code, notes, and snippets.

@ndunk28
Last active August 25, 2017 04:41
Show Gist options
  • Save ndunk28/2eaeae2b1a0aa94322dc39615796a0d4 to your computer and use it in GitHub Desktop.
Save ndunk28/2eaeae2b1a0aa94322dc39615796a0d4 to your computer and use it in GitHub Desktop.
Simple Parallax using jquery
.parallax {
background-image: url('http://via.placeholder.com/1600x800');
background-position: top center;
background-repeat: no-repeat;
background-size: 100% auto;
}
$(function() {
var
$el = $('.parallax'), // trigger element
$scrollWrap = $('window'), // scroll element
speed = 0.05; // speed animation
function parallax(){
var scroll = $scrollWrap.scrollTop();
$el.css({
'background-position':'50% '+(speed*scroll)+'px'
});
};
$scrollWrap.on("scroll", parallax);
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment