Есть ли способ отключить анимацию прокрутки jQuery для некоторых HTML-якорей? - PullRequest
0 голосов
/ 04 января 2019

Я бы хотел, чтобы каждый href якорь по умолчанию плавно прокручивался (это работает!) ... и вручную предотвращал некоторые из них.

Есть ли умный способ сделать это? Может быть "не прокручиваемый" класс CSS для цели? Как бы это выглядело?

jQuery( function ( $ ) {
    'use strict';

    // Smooth scroll on anchor links
    $('a[href^="#"]').on('click', function(e) {
        e.preventDefault();
        var target = this.hash;
        var $target = $(target);
        $('html, body').stop().animate({
            'scrollTop': $target.offset().top-20
        }, 900, 'swing', function() {
            window.location.hash = target;
        });
    });

});

Все html-якоря плавно прокручиваются с помощью этого скрипта. Хорошо!

Некоторые конкретные якоря не должны плавно прокручиваться. Это необходимо.

Ответы [ 2 ]

0 голосов
/ 04 января 2019

Здравствуйте, вы можете добавить пользовательский атрибут или класс к элементам привязки, для которых вам не нужна прокрутка.

Например:

<a href="#hello">click</a>
<a href="#hello" noscroll>no scroll</a>

и измените код следующим образом:

jQuery( function ( $ ) {
'use strict';

// Smooth scroll on anchor links
$('a[href^="#"]:not([noscroll])').on('click', function(e) {
    e.preventDefault();
    var target = this.hash;
    var $target = $(target);
    $('html, body').stop().animate({
        'scrollTop': $target.offset().top-20
    }, 900, 'swing', function() {
        window.location.hash = target;
    });
});

});

Здесь jsfiddle пример . Желаем удачи, не стесняйтесь задавать любые вопросы

0 голосов
/ 04 января 2019

просто добавьте новый класс к a тегам, для которых вы хотите отключить:

<a class="noscroll"  href="# ...

и измените это на:

 $('a[href^="#"]').not(".noscroll").on(...
...