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

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

.site-bg-0 {
  background-image: url();
}
.site-bg-1 {
  background-image: url();
}
.site-bg-2 {
  background-image: url();
}

<ul>
  <li class="tablinks" data-index="1">1</li>
  <li class="tablinks" data-index="2">2</li>
  <li class="tablinks" data-index="3">3</li>
</ul>
<div class="tabcontainer">
  <div class="tabcontent">
    1
  </div>
  <div class="tabcontent">
    2
  </div>
  <div class="tabcontent">
    3
  </div>
</div>

<a href="#" data-index="2">2</a>

function openTab(curIndex) {
            const tabcontent = document.getElementsByClassName('tabcontent');
            tabcontent.forEach((one, index) => {
              one.style.display = index != curIndex ? 'none' : 'flex';
            });

            const tablinks = document.getElementsByClassName('tablinks');
            tablinks.forEach((one, index) => {
              if (index != curIndex) one.classList.remove('active');
              else if (!one.classList.has('active')) one.classList.add('active');
            });
        }

            const links = document.querySelector('[data-index]');
            links.forEach(one => {
              one.addEventListener('click', () => openTab(one.dataset.index));
            });