TEST-web-siteの3のjsコーディング

document.addEventListener("DOMContentLoaded", function () {
  const openBtn = document.querySelector(".openbtn");
  const gNav = document.getElementById("g-nav");
  const overlay = document.getElementById("overlay");

  // メニューを開く
  function openMenu() {
    openBtn.classList.add("active");
    gNav.classList.add("panelactive");
    overlay.classList.add("active");
    document.documentElement.classList.add("no-scroll");
  }

  // メニューを閉じる
  function closeMenu() {
    openBtn.classList.remove("active");
    gNav.classList.remove("panelactive");
    overlay.classList.remove("active");
    document.documentElement.classList.remove("no-scroll");
  }

  openBtn.addEventListener("click", function () {
    if (gNav.classList.contains("panelactive")) {
      closeMenu();
    } else {
      openMenu();
    }
  });

  // オーバーレイクリックで閉じる
  overlay.addEventListener("click", closeMenu);

  // ナビゲーション内リンククリックで閉じる
  const navLinks = gNav.querySelectorAll("a");
  navLinks.forEach(function (link) {
    link.addEventListener("click", closeMenu);
  });
});

const slider = document.querySelector(".product_items");
let isDown = false;
let startX;
let scrollLeft;
slider.addEventListener("mousedown", (e) => {
  isDown = true;
  slider.classList.add("active");
  startX = e.pageX - slider.offsetLeft;
  scrollLeft = slider.scrollLeft;
});
slider.addEventListener("mouseleave", () => {
  isDown = false;
  slider.classList.remove("active");
});
slider.addEventListener("mouseup", () => {
  isDown = false;
  slider.classList.remove("active");
});
slider.addEventListener("mousemove", (e) => {
  if (!isDown) return;
  e.preventDefault();
  const x = e.pageX - slider.offsetLeft;
  const walk = (x - startX) * 1.5; // スクロール速度調整
  slider.scrollLeft = scrollLeft - walk;
});