parallax.jsプラグインで浮かぶ背景を小数第三位まで値を取得できるようにしたい。

Question

背景画像を浮かばせるプラグインを使用して、上下に浮かせることは
実現したのですが、今のままでは動きが若干早いので、滑らかな動きに
すべく進む値を細かく取得しようと考えています。
どうかヒントだけでもお願いします。
そしてこちらがダウンロード先のURLとそのバージョンです。↓
URL:リンク内容
Version3.1.0

コード  
<div class="visual">
  <ul id="scene" data-friction-x="0" data-friction-y="0.01" data-
  scalar-x="0" data-scalar-y="32">
    <li class="layer" data-depth="1">
    <div class="bg"></div></li>
  </ul>
</div>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script src="js/parallax.min.js"></script>
    <script src="js/script.js"></script>

コード 
.visual #scene {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    overflow: hidden;
}

.visual #scene li {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    z-index: 6;
    right: 0;
    bottom: 0;
    background: url(../images/toaru-accera.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}

.bg {
    text-align: center;
    color: #ffffff;
    margin-top: 50px;
}

コード     
var demo = document.getElementById("scene");
    var parallax = new Parallax(scene);
$(function() {
    $("#scene").parallax();
    });

リンクです。リンク内容

Comments

[m.ts10806]

一応、プラグイン公式のURLと自身が導入されているバージョンも質問本文に追記してください

[dream]

わかりました。

[dream]

お待たせしてすみません。質問本文に付け加えておきました。

Answer 1

スクロールスピードをbackground-positionで指定するようにしたらどうでしょう？

$(function() {
    $(window).scroll(function(){
        var scroll = $(this).scrollTop(); // スクロール値を取得
/*
        $('#scene').css('background-position', '10px ' + parseInt( -scroll / 50 ) + 'px'); // 1/50のスピード

        $('#scene').css('background-position', '220px ' + parseInt( -scroll / 10 ) + 'px'); // 1/10のスピード
*/
        $('#scene').css('background-position', '440px ' + parseInt( -scroll / 2 ) + 'px'); // 1/2のスピード
    });
});

Comments

[dream]

回答ありがとうございます。私が使っているプラグインはmousemoveで動くタイプのもの
なので異なるのですが、parseIntというメソッドは初めて知りました。
このメソッドはどんな役割を果たしているのですか？

[madone99]

除算時に小数点が出ても整数になるように変換をしています。

Pallaxインスタンスに、frictionで摩擦係数を指定できるようなので、以下のようにして調整されてみるといかがですか？

const parallaxInstance = new Parallax(document.getElementById('scene'), {
relativeInput: true
});
parallaxInstance.friction(0.2, 0.2);

[dream]

ありがとうございます。早速やってみます！

[dream]

おかげさまで近い動きにはなりました。
ありがとうございました！