检测文章的位置,并使用当前类激活菜单

时间:2016-06-19 17:15:54

标签: javascript jquery html

我在两个栏目中创建一个网站,左边是菜单,右边是内容。
Here is a full preview of the website
当您点击链接时,内容会自动对齐右边。

我寻找一种扭转过程的方法:
当您向右滚动时,您正在阅读的文章将被jquery检测到,并激活左侧的链接。我怎么能做到这一点?

A visual explanation

$('.expander').click(function(e) {
    e.preventDefault();

    $('.expander ').removeClass('current');
    $(this).addClass('current');

    var container = $(this).parents('.menu-content').attr('data-id');
    $desc = $(this).parents('.titre-soustitre');

    console.log("click");
    $("#scrollingaside").customScrollbar("scrollByY", $desc.offset().top - ($(window).width() / 100 * 3.6));
    $("#scrollingontheright").customScrollbar("scrollByY", $("#" + container).offset().top - ($(window).width() / 100 * 7.2));




    console.log("");
});

$('.article').click(function(e) {


    var idproj = $(this).find('span:first').attr('id');
    $('.menu-content[data-id="' + idproj + '"]').find('.expander').trigger('click');


});

编辑:一项无效的测试

    function checkActiveSection()
{
    var fromTop = jQuery(window).scrollTop() ;
    var idproj = $(this).find('span:first').attr('id');
    jQuery('#scrollingontheright .article').each(function(){
        var sectionOffset = jQuery(this).offset() ;
        if ( sectionOffset.top <= fromTop )
        {

            jQuery('.menu-content[data-id="'+idproj + '"]').addClass('current') ;

        }
    }) ;
}

0 个答案:

没有答案
相关问题