BitGoblin/website
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Made the featured YouTube video links land on the page while scrolling down

Browse Source
This commit is contained in:
Gregory Ballantine
2021-08-21 01:44:21 -04:00
parent a688fc248c
commit 31b63accd4
2 changed files with 23 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/assets/scripts/varrock.coffee
View File

@ -4,6 +4,15 @@
$(window).scroll ->
wScroll = $(this).scrollTop()
# Header stuff
# Header parallax
$('#header-logo').css('transform', 'translate(-50%, ' + (wScroll / 2) + 'px)')
$('#header-logo h1').css('transform', 'translateY(-' + (wScroll / 2) + 'px)')
# YouTube section parallax
if not (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent))
$('.youtube-section').each (i, e) ->
if wScroll >= ($(e).offset().top - $(window).height())
offset = (Math.min(0, wScroll - $(e).offset().top + $(window).height() - 500)).toFixed()
$(e).find('.video-card:first-child').css('transform': 'translate(' + offset + 'px, ' + Math.abs(offset * 0.2) + 'px)')
$(e).find('.video-card:last-child').css('transform': 'translate(' + Math.abs(offset) + 'px, ' + Math.abs(offset * 0.2) + 'px)')