https://www.km-bus.tokyo/assets/js/common.js

1// ハンバーガーメニューの開閉
2const hamburger = document.querySelector('.l-header__hamburger');
3const menu = document.querySelector('.l-header__hamburger__menu');
4
5hamburger.addEventListener('click', (e) => {
6  e.preventDefault();
7  hamburger.classList.toggle('is-active');
8  menu.classList.toggle('is-open');
9
10  document.body.classList.toggle('is-fixed');
11});
12
13// ページトップ
14const pageTop = document.getElementById('pageTop');
15const footer = document.querySelector('.l-footer');
16
17window.addEventListener('scroll', () => {
18  const scrollY = window.scrollY;
19  const footerRect = footer.getBoundingClientRect();
20  const footerTop = footerRect.top + scrollY;
21  const windowHeight = window.innerHeight;
22
23  const buttonBottom = window.innerWidth > 768 ? 40 : 20;
24  const buttonHeight = window.innerWidth > 768 ? 100 : 60;
25  const absoluteTop = window.innerWidth > 768 ? -50 : -30;
26  const buttonRight = window.innerWidth > 768 ? 54 : 10;
27
28  if (scrollY > 300) {
29    pageTop.classList.add('is-show');
30  } else {
31    pageTop.classList.remove('is-show');
32  }
33
34  if (scrollY + windowHeight - buttonBottom >= footerTop + absoluteTop + buttonHeight) {
35    pageTop.classList.add('is-absolute');
36  } else {
37    pageTop.classList.remove('is-absolute');
38  }
39});
40
41pageTop.addEventListener('click', () => {
42  window.scrollTo({
43    top: 0,
44    behavior: 'smooth'
45  });
46});
47
48//MV比率調整
49function updateScale() {
50  const scale = Math.min(1, Math.max(0.3, window.innerWidth / 1500));
51  document.querySelector('.p-top-visual').style.setProperty('--scale', scale);
52}
53
54updateScale();
55window.addEventListener('resize', updateScale);