hexo-theme-keep/source/js/header-shrink.js

41 lines
1.3 KiB
JavaScript
Raw Normal View History

KEEP.initHeaderShrink = () => {
2020-11-20 12:02:22 +08:00
KEEP.utils.headerShrink = {
headerDom: document.querySelector('.header-wrapper'),
isHeaderShrink: false,
init() {
this.headerHeight = this.headerDom.getBoundingClientRect().height;
},
headerShrink() {
const scrollTop = document.body.scrollTop || document.documentElement.scrollTop;
if (!this.isHeaderShrink && scrollTop > this.headerHeight) {
this.isHeaderShrink = true;
2021-01-05 11:48:58 +08:00
document.body.classList.add('header-shrink');
} else if (this.isHeaderShrink && scrollTop <= this.headerHeight) {
this.isHeaderShrink = false;
2021-01-05 11:48:58 +08:00
document.body.classList.remove('header-shrink');
}
},
2021-01-05 15:39:21 +08:00
toggleHeaderDrawerShow() {
const domList = [document.querySelector('.window-mask'), document.querySelector('.menu-bar')];
2021-01-05 15:39:21 +08:00
if (KEEP.theme_config.pjax.enable === true) {
domList.push(...document.querySelectorAll('.header-drawer .drawer-menu-list .drawer-menu-item'));
}
domList.forEach(v => {
v.addEventListener('click', () => {
document.body.classList.toggle('header-drawer-show');
});
});
2021-01-05 15:39:21 +08:00
}
}
2020-11-20 12:02:22 +08:00
KEEP.utils.headerShrink.init();
2021-01-05 15:39:21 +08:00
KEEP.utils.headerShrink.headerShrink();
KEEP.utils.headerShrink.toggleHeaderDrawerShow();
}