javascript - 对 Angular 滚动 Javascript

Question

我在这里遇到了一个问题。我正在尝试沿对 Angular 线滚动我的文档。它采用文档宽度和高度，并将其值添加到每个部分元素中。我知道如何在 y Angular 滚动它，但可以找到一种方法使 x Angular 滚动同步滚动 y Angular 宽度。

感谢任何提示!

这是我的js:

$(function() {
    var windowHeight = $(window).height();
    var windowWidth = $(window).width();
    var sectionsNumbers = $("#content section").length - 1;
    var sectionCount = 0;
    // Scroll sets
    var windowScrollX = ((sectionsNumbers + 1) * windowWidth) - windowWidth;
    alert(windowScrollX);
    // Set mask w and h
    $("#mask").css("width", windowWidth);
    $("#mask").css("height", windowHeight);
    $(".scrollRule").css("height", (sectionsNumbers + 1) * windowHeight);
    $("#content section").each(function() {
        // Defines its width and height
        $(this).css("width", windowWidth);
        $(this).css("height", windowHeight);
        // Defines its position
        $(this).css("left", sectionCount * windowWidth);
        $(this).css("top", sectionCount * windowHeight);
        sectionCount++;
    });
    // When window scrolls
    $(window).scroll(function() {
        var curScrollTop = $(window).scrollTop();
        $("#debug").html(curScrollTop);
        $("#content").css("top", "-" + curScrollTop);
    });
});​

我明白了!

我只需将窗口总宽度除以窗口总滚动高度即可。感谢大家!

Answer 1

尝试使用 jQuery 的动画功能。只需将我的代码示例中的整数替换为您计算出的位置值即可。

jQuery('html,body').animate(
    {
         scrollTop: 25
         ,scrollLeft: 20
    }
    ,'slow'
);

来源:http://api.jquery.com/animate/