window.scroll() - problem

0

Cześć.
Mam problem i już nie mam sił z tym walczyć :( Nie mam pojęcia czemu się tak dzieje... Niżej kod:

<!DOCTYPE html>
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style>
    body {
      height: 3000px;
    }

    div {
      display: inline;
      background-color: royalblue;
    }
  </style>
</head>

<body>
  <a class="nav" href="#">Klik</a> <!-- NIE PRZEWIJA! oO -->
  <button class="nav">Klik</button> <!-- przewija -->
  <div class="nav">Klik</div> <!-- przewija -->
  <script>
    
    const btn = document.querySelectorAll('.nav');
    for (const i of btn) {
      i.addEventListener('click', function () {
        console.log("przewija...");
        window.scroll(0, 1500);
      });
    }

  </script>
</body>
</html>

Jak klikam na diva lub buttona to wsio ładnie działa (wypisuje w konsoli komunikat i ładnie przewija okno do 1500px, natomiast...
co bym nie robił jak klikam w odnośnik a to za Chiny nie chce okna przewijać (mimo iż jak debuduje to wchodzi do funkcji po kliku i w konsoli komunikat się pojawia... i tylko tyle ;/
Proszę o pomoc.
Pozdrawiam.

2

Dodaj e.preventDefault() w kodzie. Domyślnie kliknięcie na <a> powoduje przesunięcie do góry strony, więc musisz temu zapobiec.

const btn = document.querySelectorAll('.nav');
    for (const i of btn) {
      i.addEventListener('click', function (e) {
        console.log("przewija...");
        window.scroll(0, 1500);
		
		e.preventDefault();
      });
    }
0

Ehhh na śmierć zapomniałem o tej funkcji ;/ Super! Wszystko działa jak należy, dzięki wielkie :)

1 użytkowników online, w tym zalogowanych: 0, gości: 1