垂直視差がParallax.jsを使用していません

Question

したがって、プラグインparallax.jsと星を作成する2つの別々のキャンバス要素を使用してスペースエフェクトを作成しようとしています。私は、プラグインのギブスで指示されているようにHTMLとJSを設定しましたが、キャンバス要素のどちらも垂直方向に移動しません。

私はそれを実証するJS Fiddleを作った。コードの最初の部分はプラグインで、下部には私のCanvasコードがあります。

ここはキャンバス要素に使用したコードです。

var cvsSmall = document.getElementById("cvsSmall"), 
    ctxSmall = cvsSmall.getContext("2d"), 
    cvsBig = document.getElementById("cvsBig"), 
    ctxBig = cvsBig.getContext("2d"), 
    particlesSmall = [], 
    particlesBig = []; 

//main 
fitCanvas(); 
var scene = document.getElementById('scene'); 
var parallax = new Parallax(scene); 
makeParticles(20); 
drawParticles(); 
ctxSmall.fillRect(0, window.innerWidth, 0, window.innerHeight); 

//functions 
function fitCanvas() { 
    cvsSmall.width = window.innerWidth; 
    cvsBig.width = window.innerWidth; 
    cvsSmall.height = window.innerHeight; 
    cvsBig.height = window.innerHeight; 
} 

function makeParticles(amount) { 
    for (i = 0; i < amount; i++) { 
    particle = { 
     x: Math.random() * cvsSmall.width, 
     y: Math.random() * cvsSmall.height, 
     size: 1, 
    } 
    particlesSmall.push(particle); 
    } 
    for (i = 0; i < amount; i++) { 
    particle = { 
     x: Math.random() * cvsBig.width, 
     y: Math.random() * cvsBig.height, 
     size: 5, 
    } 
    particlesBig.push(particle); 
    } 
} 

function drawParticles() { 
    for (i = 0; i < particlesSmall.length; i++) { 
    p = particlesSmall[i]; 
    ctxSmall.beginPath(); 
    ctxSmall.fillStyle = "#FFFFFF"; 
    ctxSmall.arc(p.x, p.y, p.size, 0, 2 * Math.PI); 
    ctxSmall.closePath(); 
    ctxSmall.fill(); 
    } 
    for (i = 0; i < particlesBig.length; i++) { 
    p = particlesBig[i]; 
    ctxBig.beginPath(); 
    ctxBig.fillStyle = "#FFFFFF"; 
    ctxBig.arc(p.x, p.y, p.size, 0, 2 * Math.PI); 
    ctxBig.closePath(); 
    ctxBig.fill(); 
    } 
} 

Answer 1

これはかなりニッチな問題であるが、それは私の<UL>の高さが0だった、それは垂直視差に影響を与えていることが判明しました。