Skip to content

Instantly share code, notes, and snippets.

@jsakhil
Forked from omgmog/parallax-scroll.js
Created July 21, 2021 11:33
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 jsakhil/2c77dfd51482a566de1465ba1fa649ef to your computer and use it in GitHub Desktop.
Save jsakhil/2c77dfd51482a566de1465ba1fa649ef to your computer and use it in GitHub Desktop.
Simple parallax background scrolling with jQuery
$(function() {
var $el = $('.parallax-background');
$(window).on('scroll', function () {
var scroll = $(document).scrollTop();
$el.css({
'background-position':'50% '+(-.4*scroll)+'px'
});
});
});
.parallax-background {
background-image: url('http://placekitten.com/1000/1000');
background-position: 50% 0;
background-repeat: no-repeat;
-webkit-background-size: cover;
background-size: cover;
-moz-transform: translate3d(0,0,0);
-webkit-transform: translate3d(0,0,0);
transform: translate3d(0,0,0);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment