Как сделать так, чтобы страница, управляемая JinvertScroll, загружалась с уже прокрученной страницей влево? - PullRequest
Новая
       7

Как сделать так, чтобы страница, управляемая JinvertScroll, загружалась с уже прокрученной страницей влево?

0 голосов
/ 20 января 2020

Я начинающий программист и могу использовать некоторую помощь. У меня есть страница, построенная вокруг кода JinvertScroll Jquery. Я хочу, чтобы страница загружалась с уже прокрученными изображениями, чтобы пользователь фактически прокручивал, или, скорее, прокручивал то, что обычно было бы в обратном направлении. Это страница, поэтому вы можете видеть, что я пытаюсь сделать (я хочу, чтобы текст, выходящий изо рта дракона, загружался, чтобы он развернулся, когда пользователь прокручивает колесо мыши): http://xofer.net/test/

1 Ответ

0 голосов
/ 20 января 2020

Я скачал исходный код 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
    });
});

Исходный код библиотеки

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);
});
...