顶部导航栏隐藏

themes/Hexo/components/HeaderArticle.js

@@ -28,6 +28,7 @@ export default function HeaderArticle ({ post }) {
     }
   }
   useEffect(() => {
+    scrollTrigger()
     window.addEventListener('scroll', scrollTrigger)
     return () => {
       window.removeEventListener('scroll', scrollTrigger)
@@ -36,6 +37,7 @@ export default function HeaderArticle ({ post }) {
 
   return (
       <div
+        id="header"
         className="w-full h-96 relative md:flex-shrink-0 overflow-hidden bg-cover bg-center bg-no-repeat"
         style={{ backgroundImage: headerImage }}
       >

themes/Hexo/components/TopNav.js

@@ -27,7 +27,10 @@ const TopNav = ({ tags, currentTag, categories, currentCategory, postCount }) =>
   const scrollTrigger = throttle(() => {
     const scrollS = window.scrollY
     const nav = document.querySelector('#sticky-nav')
-    if (scrollS >= windowTop && scrollS > 20) {
+    const header = document.querySelector('#header')
+    const showNav = (scrollS > 10 && scrollS >= windowTop) || (header && scrollS < 5) // 非首页无大图时影藏顶部 滚动条置顶时隐藏
+
+    if (!showNav) {
       nav && nav.classList.replace('top-0', '-top-16')
       windowTop = scrollS
     } else {