Недельный календарь с фильтром и и смещением зависящим от скрола

Как сделать календарь со смещением в зависимости от скрола и подсветкой активного дня и фильтром: как пример - https://members.onepeloton.com/schedule/cycling Пытался сделать так? но работает с глюками:

 $(window).scroll(function(){
    var $days = $('h2.day');
    let $week = $('.week');

   $week.each(function(i,el){
        var top  = $(el).offset().top;
        var scroll = $(window).scrollTop();
        var week_number  = $(el).attr('id');
        if( scroll > top){
            change_top_menu(week_number);
        }
    })

    $sections.each(function(i,el){
        var top  = $(el).offset().top;
        var bottom = top +$(el).height();
        var scroll = $(window).scrollTop();
        var id = $(el).attr('id');
        $('a .menu_top').removeClass('active');
        if( scroll > top-190 ){
            $('a .menu_top').addClass('active');    
        }
    });


});

function create_week(week_number=null){
    for (var i = 0; i < 7; i++) {
        var day=week*7+i;
        $('#main_nav').append('<li><a href="#'+ moment(days[day].id,"MM-DD").format("MM-DD")+'">' +
            '<div>' +
            '<p>'+ moment(days[day].id,"MM-DD").format("ddd") +'</p>' +
            '</div></a></li>');

    }
}

Ответы (0 шт):