javascript - 滚动到一个链接并激活它

标签 javascript jquery html css

我制作了一个包含两栏的网站。左侧是所有链接,另一侧是内容。当您单击链接时,内容会上升,链接也会自动对齐。
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');
    });

最佳答案

//使用 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");
});

关于javascript - 滚动到一个链接并激活它,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37395157/

相关文章:

javascript - jquery attr 无法正常工作

javascript - 如何检查所有异步任务是否已完成

java - Playframework 更改 ebean 数据库中的值

javascript - 将位置从绝对位置更改为固定位置时意外跳转,为什么?

html - Bootstrap jquery垂直进度条设置

javascript - ExtJS AOP 类似于dojo 中提供的吗?

javascript - Canvas2Image.js 通过元素点击将 base64 图像保存为 png

JavaScript - 删除网页最后一个选项卡上的 localStorage

javascript - JS : If you call the function, 结果是 3,但是如果你用 f.call(f) 绑定(bind)上下文 - 结果是 5

javascript - 用 jQuery 重写原生 javascript