моя плавная прокрутка не работает при нажатии, она направляет меня на страницу с именем моего идентификатора? - PullRequest
0 голосов
/ 02 февраля 2020

Я пытаюсь использовать плавную прокрутку на своей веб-странице, но она не работает.

Мой Jquery код:

$('a[href*="#"]').not('[href="#"]').not('[href="#0"]').click(function(event) {
  console.log("jquery");
    if (
      location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '')
      &&
      location.hostname == this.hostname
    ) {
      var target = $(this.hash);
      target = target.length ? target : $('[name=' + this.hash.slice(1) + ']');
      if (target.length) {
        event.preventDefault();
        $('html, body').animate({
          scrollTop: target.offset().top
        }, 1000, function() {
          var $target = $(target);
          $target.focus();
          if ($target.is(":focus")) {
            return false;
          } else {
            $target.attr('tabindex','-1');
            $target.focus();
          };
        });
      }
    }
  });

и мой HTML код файла:


<nav class="navbar navbar-expand-lg navbar-dark bg-nav">
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarTogglerDemo02" aria-controls="navbarTogglerDemo02" aria-expanded="false" aria-label="Toggle navigation">
          <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="navbarTogglerDemo02">
          <ul class="navbar-nav navbar-center mt-2 mt-lg-0">
            <li class="nav-item active nav-li slideRight">
              <a class="nav-link" href="#home"><font face = "Helvetica" size = "4">Home</font></a>
            </li>
            <li class="nav-item active nav-li slideRight">
              <a class="nav-link" href="#about"><font face = "Helvetica" size = "4">About</font></a>
            </li>
            <li class="nav-item active nav-li slideDown">
              <img src="img/vhlogo.png" class="navbar-brand size_hide" height="60px" width="60px"/>
            </li>
            <li class="nav-item active nav-li slideLeft">
              <a class="nav-link" href="#gallery"><font face = "Helvetica" size = "4">Gallery</font></a>
            </li>
            <li class="nav-item active nav-li slideLeft">
              <a class="nav-link" href="#"><font face = "Helvetica" size = "4">Login/SignUp</font></a>
            </li>
          </ul>
        </div>
    </nav>

И вот так я дал идентификатор при нажатии на ссылку в навигационной панели, он перенаправляет на URL с последним значением / # галерея, но это не файл

<div id="gallery" class="container">

1 Ответ

0 голосов
/ 03 февраля 2020

На самом деле я использовал для ссылки на мой файл. поэтому он перенаправлял меня на базовое имя url + id.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...