滚动多个元素时添加/删除类

时间:2014-01-23 21:31:05

标签: javascript jquery html

我在使用脚本(我可能在这里找到)在滚动时添加/删除元素上的类。脚本将菜单中的 href 关联,以将类添加/删除到页面中的相应元素。当使用一个菜单和一组元素时,脚本工作正常,但我试图使它可用于多个菜单,我似乎无法找到错误。我在 getTargetTop()函数中出错,但我无法解决它。

以下是我正在使用的代码:

$(window).scroll(function(e){
    checkSectionSelected($(window).scrollTop());
});

function getTargetTop(elem){
    console.log(elem.attr('href'));
    var id = elem.attr("href");
    var offset = 0;
    return $(id).offset().top - offset;
}

var sections = $('ul.ctrl a');
var mainmenu = $('nav a');

function checkSectionSelected(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) {
        $('.char').removeClass('active');
        $('.char'+section.attr('href')).addClass('active');
        sections.parent('li').siblings('li').removeClass("active");
        section.parent('li').addClass("active");
    }
};

var m;

for (m = 0; m < mainmenu.length; m++) {
    var link = $(mainmenu[m]);
    var newTar = getTargetTop(link);
    if (scrolledTo > newTar - threshold && scrolledTo < newTar + threshold) {
        sections.parent('li').siblings('li').removeClass("active");
        section.parent('li').addClass("active");
    }

};

}

感谢您的帮助!

0 个答案:

没有答案