Why does the page scroll up when I click on the popup button?

Question

css

Good afternoon.
Created a modal window with a form, so far only layout.
Here is the form

<div class="popup-address" id="js-popup-address">
    <a class="popup-address__close" href="#" id="js-popup-address__close"></a>
    <div class="popup-address__content">
        <div class="popup-address__form">
            <div class="form-group">
                <input type="text" name="nome" placeholder="Nome">
            </div>
            <div class="form-group">
                <input type="text" name="cognome" placeholder="Cognome">
            </div>
            <div class="form-group">
                <input type="email" name="email" placeholder="Email">
            </div>
            <div class="form-group">
                <input type="tel" name="telefono" placeholder="Telefono">
            </div>
            <div class="form-group">
                <textarea name="messaggio" placeholder="Messaggio"></textarea>
            </div>
            <div class="privacy">
                <input id="check" type="checkbox" name="check">
                <label for="check">Dichiaro di aver letto ed accettato l'informativa sulla privacy
                    <a href="/privacy/">(Leggi l'informativa)</a>
                </label>
            </div>
            <input class="btn btn--transparent btn--block" type="submit" value="Invia Richiesta">
        </div>
    </div>
</div>

There is a button, when you click on it, a popup appears, while the page scrolls up.

let popupAddress = function () {
    $('.btn--popup-address').on('click', function (e) {
      e.preventDefault();

      $('body').addClass('body--fixed');
      $('#js-overlay').fadeIn();
      $('#js-popup-address').fadeIn();
    });

    $('#js-popup-address__close, #js-overlay').on('click', function (e) {
      e.preventDefault();

      $('body').removeClass('body--fixed');
      $('#js-overlay').fadeOut();
      $('#js-popup-address').fadeOut();
    });
  };
  popupAddress();

html {
  height: 100%;
}

body.body--fixed {
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  overflow: hidden;
}

When clicking on any of the "Contact us now"

buttons borgoluce.ml/en/ristoranti This is the

first time I've encountered this behavior.
What could be the reason?
Thanks in advance for your help.

Answer 1

Buttons have href="#", remove href altogether.