Перескакивает вверх при нажатии. Что делать?

Question

[▪ ▪]

Привет всем. Недавно работал с сайтом который мне передали от верстальщика. На мобильных экранах есть кнопка меню. При ее нажатии контент перескакивает в самый верх. Это очень не удобно. Пример на этом сайте: ultimatevc.io
Там какой то скрипт внизу страницы возможно причастен к этому. Можно ли как то исправить, чтобы при нажатии на кнопку меню, сайт не скроллился вверх к шапке?

Answer 1

[Антон Иванов]

Скорее всего, вы забыли отменить поведение по умолчанию для этой кнопки, preventDefault() вам в помощь.

Comments

[▪ ▪]

Не совсем понимаю). Вот код:

let mobile = getComputedStyle(document.querySelector('section.team h3')).textAlign=='center';
      
      document.querySelector('header .menu').addEventListener('click', function () {
          document.body.classList.toggle('menu')
      })
      
      document.querySelectorAll('a').forEach(function (value) {
          if (value.hash)
              value.addEventListener('click', function (e) {
      
                  document.body.classList.remove('menu');
      
                  if (!mobile) {
                      e.preventDefault();
                      window.scrollTo({
                          'behavior': 'smooth',
                          'left': 0,
                          'top': document.querySelector(e.target.hash).offsetTop
                      });
                  }
              })
      })
      
      document.querySelectorAll('section.team .show').forEach(function (value) {
          value.addEventListener('click', function (e) {
              e.target.parentElement.classList.remove('hide');
          })
      })
      
      if (!mobile)
          var slider = tns({
              container: 'section.projects ul.slider',
              "swipeAngle": false,
              "speed": 1000,
              items: 2,
              gutter: 20,
              nav: false,
              rewind: true,
              controlsContainer: 'section.projects .btns',
              "mouseDrag": true,
              "preventScrollOnTouch": "force",
          })
      else
          var slider = tns({
              container: 'section.projects ul.slider',
              "swipeAngle": false,
              "speed": 1000,
              items: 1,
              gutter: 20,
              nav: false,
              rewind: true,
              controlsContainer: 'section.projects .btns',
              "mouseDrag": true,
              "preventScrollOnTouch": "force",
          })
      
      document.querySelector('section.projects .big-btns .prev').addEventListener('click', function () {
          document.querySelector('section.projects .btns .prev').click();
      })
      
      document.querySelector('section.projects .big-btns .next').addEventListener('click', function () {
          document.querySelector('section.projects .btns .next').click();
      })
      
      
      
      // if (!mobile)
      //     var slider = tns({
      //         container: 'section.team ul.slider',
      //         "swipeAngle": false,
      //         "speed": 1000,
      //         items: 2,
      //         gutter: 20,
      //         nav: false,
      //         rewind: true,
      //         controlsContainer: 'section.team .big-btns',
      //         "mouseDrag": true,
      //         "preventScrollOnTouch": "force",
      //     });

Answer 2

[Марат Гарифуллин]

Возможно, дело в этом?

body.menu {
    position: fixed;
    overflow: hidden;
    width: 100%;
}

Comments

[▪ ▪]

Из-за позиции?

[Марат Гарифуллин]

Да, надо проверить