滚动到水平问题，时间线 jquery

Question

我的 scrollTo 出现问题，它似乎没有滚动到水平锚点。

看起来锚的位置正在重置。

http://jsfiddle.net/6nqv78wp/7/

$(".jq-timeline-header").click(function (e) {
    if ($(window).width() < 768) {
        $(this).next().toggle();
    }
});


$('.jq-scrollto').bind('click', function (event) {
    console.log($($(this).attr('href')).offset().left)
    $('.jq-scrollto').removeClass('active');
    $(this).addClass('active');
    $('.jq-timeline-inner').stop().animate({
        scrollLeft: $($(this).attr('href')).offset().left
    }, 1000);
    consoleLog();
    event.preventDefault();
});

var x, y, top, left, down;

$(".jq-timeline-inner").mousedown(function (e) {
    e.preventDefault();
    down = true;
    x = e.pageX;
    y = e.pageY;
    top = $(this).scrollTop();
    left = $(this).scrollLeft();
});

$(".jq-timeline-inner").mousemove(function (e) {
    if (down) {
        var newX = e.pageX;
        var newY = e.pageY;

        //console.log(y+", "+newY+", "+top+", "+(top+(newY-y)));

        $(this).scrollTop(top - newY + y);
        $(this).scrollLeft(left - newX + x);
    }
});

$(".jq-timeline-inner").mouseup(function (e) {
    down = false;
});

Answer 1

更改 JQuery 将解决您的问题：

 $('.jq-scrollto').bind('click', function (event) {

        console.log($($(this).attr('href')).offset().left);

        $('.jq-scrollto').removeClass('active');
        $(this).addClass('active');


        $('.jq-timeline-inner').stop().animate({
            scrollLeft:  $($(this).attr('href')).offset().left + $('.jq-timeline-inner').scrollLeft()  //Changes here.
        }, 1000);
        event.preventDefault();
    });

查看Fiddle Here.