LBRYFoundation/lbryorg
1
0
Fork 0
mirror of https://github.com/LBRYFoundation/lbryorg.git synced 2025-08-23 20:47:23 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix: optimize the scroll linked effects

Browse source
This commit is contained in:
Harsh Khandeparkar 2020-06-29 11:27:50 +05:30 • committed by GitHub
parent 62a2d02eca
commit 1595031250
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 12 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
lib/js/index.js
View file

@ -1,8 +1,10 @@
// Parallax
const depthFactor = 5; // Depth of the image wrt to the 0 z-index. Infinity being at the same distance as the rest of the content and 1 being as far away as possible.
const parallaxOffset = 20;
$(window).on('scroll', () => {
const movedBy = window.scrollY;
if ($(window).height() - elem.getBoundingClientRect().top >= parallaxOffset) {
$('.parallax').each((i, parallax) => {
$(parallax).find('.parallax-layer').each((i, layer) => {
const depth = $(layer).attr('data-depth-factor') || depthFactor; // dynamically get depthFactor
@ -12,6 +14,7 @@ $(window).on('scroll', () => {
})
})
})
}
})
// /Parallax
@ -34,7 +37,7 @@ $(window).on('scroll', () => {
const delay = $(elem).attr('data-fade-delay') || fadeDelay;
if ($(window).height() - elem.getBoundingClientRect().top >= offset) {
$(elem).delay(delay).animate({opacity: 1}, duration).css({transition: `transform ${duration / 1000}s`}).css({transform: 'scale(1)'});
$(elem).delay(delay).animate({opacity: 1}, duration).css({transition: `transform ${duration / 1000}s`}).css({transform: 'scale(1)'}).removeClass('scroll-fade');
}
})
})