Использование плавной прокрутки без ссылки в строке состояния

Question

Я начал новый проект для моего колледжа, и у моего кода есть проблема.

Когда я использую Smooth Scroll для перехода к другому якору, в строке состояния появляется ссылка #name_of_the_anchor.

Smooth Scroll работает, только если я использую "href", поэтому в строке состояния будет отображаться ссылка на каждый div.

Javascript:

$(document).ready(function(){
    $('a[href^="#"]').on('click',function (e) {
        e.preventDefault();

        var target = this.hash,
        $target = $(target);

        $('html, body').stop().animate({
        'scrollLeft': $target.offset().left
        }, 400, 'swing');
    });
});

Как я могу изменить этот код, чтобы не отображать ссылки в строке состояния, но сохранять плавную прокрутку на моем сайте? Спасибо вам, ребята!

Answer 1

Вы можете сделать что-то подобное со своей ссылкой:

<a href="javascript:;" data-target="#anchor-name">My Link</a>

А затем сделайте что-то подобное с вашим JavaScript

$(document).ready(function(){
    $('a[data-darget]').on('click', function (e) {
        e.preventDefault();

        var target = $(this).data('target'),
        $target = $(target);

        $('html, body').stop().animate({
           'scrollLeft': $target.offset().left
        }, 400, 'swing');
    });
});

Что помешает поведению браузера по умолчанию. Это на самом деле не лучший способ сделать это, потому что не будет никакого сбоя, если JavaScript все равно не запустится (то есть, если пользователь отключил JS или что-то еще останавливает выполнение сценариев).