Glatter Bildlauf, um Offset-Pixel zu verankern, außer einem bestimmten Anker?

Question

ich eine UL nav haben, habe ich diese glatte Scroll jQuery Arbeits bekam:

$(document).ready(function() { 
$(document).on("scroll", onScroll); 

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

    $('a').each(function() { 
     $('.nav').removeClass('active'); 
    }) 
    $('.nav').addClass('active'); 

    var target = this.hash, 
     menu = target; 
    $target = $(target); 
    $('html, body').stop().animate({ 
     'scrollTop': $target.offset().top-59 
    }, 500, 'swing', function() { 
     window.location.hash = target; 
     $(document).on("scroll", onScroll); 
    }); 
}); 
}); 

es auf -59 Punkte geht, das ist, was ich es für alle bis auf einen Anker tun müssen, ist es eine Möglichkeit, Ich kann eine Codezeile hinzufügen, die sagt "außer Klasse X" oder etwas? Jquery Novize hier;)

Jede Hilfe wäre toll, danke.

Answer 1

Bei Ihrem Klickereignis haben Sie Zugriff auf das Navigationselement, auf das Sie geklickt haben, und auf das Ziel, zu dem Sie scrollen ($ target). Sie können sich beide ansehen, um festzustellen, ob Sie einen anderen Betrag als -59 ausgleichen müssen.

Wenn Sie nur sehr wenige Fälle haben müssen Sie eine andere für den Offset haben, können Sie dies tun:

var offset = -59; 
if ($(this).attr(href)=="#something") offset=-100; //or whatever special offset you need 

Und diese Zeile ändern:

'scrollTop': $target.offset().top-59 

dazu:

'scrollTop': $target.offset().top+offset 

---

Wenn Sie mehr Vielseitigkeit wünschen e Lösung und hat Zugriff auf den HTML-Code, können Sie entweder ein Datenattribut auf die einem < setzen> oder das Zielelement, wie

<a href="#something" data-scroll-offset=-100></a> 

Und dann, ähnlich wie bei der ersten Methode:

var offset=-59; 
if ($(this).attr("data-scroll-offset")!==null) offset=$(this).attr("data-scroll-offset"); 

wenn es auf dem Zielelement wäre, würde es $ target statt $ (dieses)

---

sein, wenn Sie ganz einen bestimmten Anker ausschließen möchten, können Sie es von der Ankerwähler entfernen könnte. Statt dessen

$('a[href^="#"]') 

ausschließen nur eine bestimmte Anker wie so:

$('a[href^="#"]:not([href="#somethingBad"])') 

oder eventuell vorhandene Anker mit einer bestimmten Klasse ausschließen etwa so:

$('a[href^="#"]:not(.excludeMe)')