37 lines
1.3 KiB
JavaScript
37 lines
1.3 KiB
JavaScript
const pageTemplateDom = document.querySelector('.page-main-content');
|
|
const sidebarToolsDom = document.querySelector('.sidebar-tools');
|
|
const headerDom = document.querySelector('.header-wrapper');
|
|
const menuBarDom = document.querySelector('.menu-bar');
|
|
const windowMaskDom = document.querySelector('.window-mask');
|
|
|
|
|
|
let isHeaderShrink = false;
|
|
const headerHeight = headerDom.getBoundingClientRect().height;
|
|
|
|
window.addEventListener('scroll', function (_e) {
|
|
const scrollTop = document.body.scrollTop || document.documentElement.scrollTop;
|
|
if (!isHeaderShrink && scrollTop > headerHeight) {
|
|
isHeaderShrink = true;
|
|
headerDom.classList.add('header-wrapper-shrink');
|
|
pageTemplateDom.classList.add('page-main-content-top-shrink');
|
|
sidebarToolsDom.classList.add('sidebar-tools-shrink');
|
|
|
|
} else if (isHeaderShrink && scrollTop <= headerHeight) {
|
|
isHeaderShrink = false;
|
|
headerDom.classList.remove('header-wrapper-shrink');
|
|
pageTemplateDom.classList.remove('page-main-content-top-shrink');
|
|
sidebarToolsDom.classList.remove('sidebar-tools-shrink');
|
|
}
|
|
});
|
|
|
|
|
|
menuBarDom.addEventListener('click', function (_e) {
|
|
headerDom.classList.toggle('header-drawer-show');
|
|
});
|
|
|
|
windowMaskDom.addEventListener('click', function (_e) {
|
|
headerDom.classList.toggle('header-drawer-show');
|
|
});
|
|
|
|
|