フェードインを外部ファイルに変更

develop/src/assets/js/fadeIn.js

 import { throttle } from "throttle-debounce";
-class Home {
-  constructor() {
-    this.modal();
-    this.fadeIn();
-  }
-
-  modal() {
-    const body = document.getElementsByTagName("body")[0];
-    const button = document.querySelectorAll(".novelList__button");
-    const modalBack = document.querySelector(".modalBackground");
-    const modal = document.querySelectorAll(".modal");
-    const closeButton = document.querySelector(".modal__button");
-
-    // モーダルを表示する
-    for (let i = 0; i < button.length; i++) {
-      button[i].addEventListener("click", addOpen);
-      function addOpen(e) {
-        e.preventDefault();
-        body.classList.add("open");
-        modalBack.classList.add("open");
-        modal[i].classList.add("open");
-      }
-    }
-
-    // モーダルを非表示にする
-    closeButton.addEventListener("click", () => {
-      body.classList.remove("open");
-      modalBack.classList.remove("open");
-      for (let i = 0; i < modal.length; i++) {
-        modal[i].classList.remove("open");
-      }
-    });
-
-    function menuClick() {
-      body.classList.remove("open");
-      modalBack.classList.remove("open");
-      const mpdalElements = document.querySelectorAll(".modal");
-
-      mpdalElements.forEach((item) => {
-        item.classList.remove("open");
-      });
-    }
-
-    const closeTrigger = document.querySelectorAll(".closeButton");
-    closeTrigger.forEach((item) => {
-      item.addEventListener("click", menuClick);
-    });
-  }
-
-  // フェードイン
+export class Fade {
   fadeIn() {
     window.addEventListener(
       "scroll",
@@ -72,7 +23,3 @@ class Home {
     );
   }
 }
-
-window.addEventListener("DOMContentLoaded", () => {
-  new Home();
-});

develop/src/assets/js/home.js

 import { Modal } from "./Modal.js";
+import { Fade } from "./fadeIn.js";
 
 const modal = new Modal();
 modal.openModal();
 
-// class Home {
-//   constructor() {
-//     this.Modal();
-//     this.fadeIn();
-//   }
-
-//   // フェードイン
-//   fadeIn() {
-//     window.addEventListener(
-//       "scroll",
-//       throttle(300, () => {
-//         window.addEventListener("scroll", () => {
-//           var element = document.getElementsByClassName("scrollUp");
-//           if (!element) return;
-
-//           var scrollY = window.pageYOffset;
-//           var windowHeight = window.innerHeight;
-//           var showTiming = 200;
-//           for (var i = 0; i < element.length; i++) {
-//             var elementClientRect = element[i].getBoundingClientRect();
-//             var elementY = scrollY + elementClientRect.top;
-//             if (scrollY > elementY - windowHeight + showTiming) {
-//               element[i].classList.add("is-show");
-//             }
-//           }
-//         });
-//       })
-//     );
-//   }
-// }
-
-// window.addEventListener("DOMContentLoaded", () => {
-//   new Home();
-// });
+const fadeIn = new Fade();
+fadeIn.fadeIn();