滚动到链接并激活它

时间:2016-05-23 15:39:26

标签: javascript jquery html css

我在两个专栏中创建了一个网站。在左侧有alls链接,在另一侧有内容。当您点击链接时内容会上升,链接也会自动对齐。
You can test it here

我正在寻找实现按钮的方法左侧底部,允许以特殊方式滚动到文档顶部:左侧将激活顶部的第一个链接(并滚动到它),同时对齐相应的文章右边。到目前为止,校准系统正在工作,除了这个链接,请参阅我试图添加下面的代码。

   $('.cd-top').bind('click', function(e) {
        e.preventDefault();

        var $container = $('.menu-content:first'),
        $desc = $('.menu-content:first');

            $desc.slideDown('100', function() {
                $("#scrollingaside").scrollTo( $container, 500, {offset: { top:-1 } } );//    la hauteur d'alignement c'est ici !
                $("#scrollingontheright").scrollTo( $("#" + $container.attr('data-id')), 1500);  
            });
        }
    });
    $('.article').bind('click', function() {
        var idproj = $(this).find('span:first').attr('id');
        $('.menu-content[data-id="' + idproj + '"]').find('.cd-top').trigger('click');
    });

2 个答案:

答案 0 :(得分:2)

//使用on()而不是bind

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

    var $container = $(this).parents('.menu-content:first'),
    $desc = $(this).parents('.menu-content');
// newly added
    $('.expander').parents(".current").removeClass('current');
    if($container.hasClass('current') == false) {

        var others = $('.current');
        $container.addClass('current');

        $desc.slideDown('100', function() {
            $("#scrollingaside").scrollTo( $container, 500, {offset: { top:-1 } } );//    la hauteur d'alignement c'est ici !
            $("#scrollingontheright").scrollTo( $("#" + $container.attr('data-id')), 1500);  
        });
    }
});
$('.article').bind('click', function() {
    var idproj = $(this).find('span:first').attr('id');
    $('.menu-content[data-id="' + idproj + '"]').find('.expander').trigger('click');
});
**// new code**
 $(".cd-top").on("click",function(){
$('.expander:first').trigger("click");
});

答案 1 :(得分:0)

您只需将点击处理程序附加到该按钮,然后从菜单中触发(“转发”)最顶层链接上的点击事件:

   $('#top').click(function() {
     $('.menu a')[0].click()
   })

必须修改选择器'.menu a'以定位正确的链接。