This commit is contained in:
杜恒 2021-06-16 11:21:11 +08:00
parent 9797185091
commit c52173b24c
4 changed files with 10 additions and 13 deletions

File diff suppressed because one or more lines are too long

View File

@ -52,7 +52,7 @@
z-index: 1000; z-index: 1000;
background: var(--background); background: var(--background);
box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1); box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1);
transition: transform 0.35s; transition: top 0.35s;
&__above { &__above {
position: relative; position: relative;
z-index: 999; z-index: 999;

View File

@ -526,24 +526,21 @@ document.addEventListener('DOMContentLoaded', () => {
const handleHeader = diffY => { const handleHeader = diffY => {
if (window.pageYOffset >= $('.joe_header').height() && diffY <= 0) { if (window.pageYOffset >= $('.joe_header').height() && diffY <= 0) {
$('.joe_header__below').addClass('active'); $('.joe_header__below').addClass('active');
$('.joe_header').css('transform', `translate3d(0, -${$('.joe_header__above').height()}px, 0)`); $('.joe_header').css('top', `-${$('.joe_header__above').height()}px`);
$('.joe_aside .joe_aside__item:last-child').css('top', $('.joe_header__below').height() + 15); $('.joe_aside .joe_aside__item:last-child').css('top', $('.joe_header').height() - $('.joe_header__above').height() + 15);
} else { } else {
$('.joe_header__below').removeClass('active'); $('.joe_header__below').removeClass('active');
$('.joe_header').css('transform', ''); $('.joe_header').css('top', 0);
$('.joe_aside .joe_aside__item:last-child').css('top', $('.joe_header').height() + 15); $('.joe_aside .joe_aside__item:last-child').css('top', $('.joe_header').height() + 15);
} }
}; };
let Y = window.pageYOffset; let Y = window.pageYOffset;
handleHeader(Y); handleHeader(Y);
let _debounce = null;
$(document).on('scroll', function () { $(document).on('scroll', function () {
clearTimeout(_debounce);
_debounce = setTimeout(() => {
const diffY = Y - window.pageYOffset; const diffY = Y - window.pageYOffset;
handleHeader(diffY); if (window.requestAnimationFrame) requestAnimationFrame(handleHeader.bind(null, diffY));
else handleHeader(diffY);
Y = window.pageYOffset; Y = window.pageYOffset;
}, 15);
}); });
} }
}); });

File diff suppressed because one or more lines are too long