From 325d3b512ea1706e354c97cf0f6eed03b881471e Mon Sep 17 00:00:00 2001
From: XPoet <i@xpoet.cn>
Date: Mon, 26 Oct 2020 16:37:09 +0800
Subject: [PATCH] perf: optimize header display when scroll

---
 source/js/utils.js | 22 +++++++++-------------
 1 file changed, 9 insertions(+), 13 deletions(-)

diff --git a/source/js/utils.js b/source/js/utils.js
index 7187301..02e1faa 100644
--- a/source/js/utils.js
+++ b/source/js/utils.js
@@ -20,26 +20,25 @@ ILS.utils = {
     const percent = Math.round(scrollTop / (scrollHeight - clientHeight) * 100).toFixed(0);
     const ProgressPercent = (scrollTop / (scrollHeight - clientHeight) * 100).toFixed(3);
 
-    if (ILS.utils.headerProgress_dom) {
-      ILS.utils.headerProgress_dom.style.visibility = percent === '0' ? 'hidden' : 'visible';
-      ILS.utils.headerProgress_dom.style.width = `${ProgressPercent}%`;
+    if (this.headerProgress_dom) {
+      this.headerProgress_dom.style.visibility = percent === '0' ? 'hidden' : 'visible';
+      this.headerProgress_dom.style.width = `${ProgressPercent}%`;
     }
 
     // hide header handle
-    const opacity = ILS.utils.headerWrapper_dom.style.opacity;
-    if (scrollTop > ILS.utils.prevScrollValue && scrollTop > 500) {
-      if (opacity !== '0') ILS.utils.headerWrapper_dom.style.opacity = '0';
+    if (scrollTop > this.prevScrollValue && scrollTop > 500) {
+      this.headerWrapper_dom.style.display = 'none';
     } else {
-      if (opacity !== '1') ILS.utils.headerWrapper_dom.style.opacity = '1';
+      this.headerWrapper_dom.style.display = 'flex';
     }
-    ILS.utils.prevScrollValue = scrollTop;
+    this.prevScrollValue = scrollTop;
   },
 
   // register window scroll event
   registerWindowScroll() {
-    window.addEventListener('scroll', function (_e) {
+    window.addEventListener('scroll', () => {
       // style handle when scroll
-      ILS.utils.styleHandleWhenScroll();
+      this.styleHandleWhenScroll();
 
       // TOC scroll handle
       if (CONFIG.toc.enable && ILS.utils.hasOwnProperty('findActiveIndexByTOC')) {
@@ -130,6 +129,3 @@ ILS.utils = {
     }
   },
 }
-
-
-