如何在已经向左滚动的页面中加载JinvertScroll驱动的页面？

Question

我是一名新手程序员，可以使用一些帮助。我有一个围绕JinvertScroll Jquery代码构建的页面。我希望页面加载已经滚动的图像，以便用户实际上是在滚动，或者说是在正常情况下向后滚动。这是页面，因此您可以看到我正在尝试做的事情（我希望加载从龙嘴出来的文本，以便当用户滚动鼠标滚轮时文本不会卷曲）：http://xofer.net/test/

Answer 1

我已经下载了jInverScroll源代码并进行了一些更改，以使滚动效果在您的示例中向后起作用。这是我对原始代码和库所做的更改：

index.html /之前：

  <div class="scroll section-1">
    <img src="images/horizon.png" alt="">

index.html /之后：

  <div class="scroll section-1" style="left:-2650px">
    <img src="images/horizon.png" alt="">

script.js /之前：

$(function() {
    $.jInvertScroll([ '.scroll' ]);
});

script.js /之后：

$(function() {
    $.jInvertScroll([ '.scroll' ], {
        reverse: true,
        initialWidth: -2650
    });
});

Source code for the library

jquery.jinvertScroll.js /之前：

// do the position calculation for each element
$.each(elements, function (i, el) {
    var deltaW = el.width() - winWidth;
    if (deltaW <= 0) {
        deltaW = el.width();
    }
    var pos = Math.floor(deltaW * scrollPercent) * -1;
    el.css('left', pos);
});

jquery.jinvertScroll.js /之后：

// do the position calculation for each element
$.each(elements, function (i, el) {
    if ( config.reverse ){
        var pos = ( config.initialWidth + ( Math.abs(config.initialWidth) * scrollPercent ) );
    } else {
        var deltaW = el.width() - winWidth;
        if (deltaW <= 0) {
            deltaW = el.width();
        }
        var pos = Math.floor(deltaW * scrollPercent) * -1;
    }
    el.css('left', pos);
});