我一直在为一个正在做的小项目制作导航菜单,但是由于缺乏编码知识,我陷入了困境。
我在导航代码上附加了一个链接,但似乎无法使它在一个mwheeldown上逐节滚动。
简单来说:每次向下滚动时,我都想跳到下一部分。 https://codepen.io/tonyexe/pen/NVrjJp
$(".navigation-container-versia a[href^='#']").on('click', function(event) {
if (this.hash !== "") {
event.preventDefault();
var hash = this.hash;
$('html, body').animate({scrollTop: $(hash).offset().top}, 500);
}
});
function getTargetTop(elem){
var id = elem.attr("href");
var offset = 60;
return $(id).offset().top - offset;
}
$(window).on("load scroll", function(e){
isSelected($(window).scrollTop())
});
var sections = $(".navigation-container-versia a[href^='#']");
function isSelected(scrolledTo){
var threshold = 100;
var i;
for (i = 0; i < sections.length; i++) {
var section = $(sections[i]);
var target = getTargetTop(section);
if (scrolledTo > target - threshold && scrolledTo < target + threshold) {
sections.removeClass("active");
section.addClass("active");
}
};