視差の背景画像をbxslider/jQueryと併用する

Question

私は、うまく動作するように見えるページに3つの視差の背景画像を表示しようとしていますが、それらにカルーセル効果を持たせる必要があるので、コード。

最初のスライドが表示されます（ただし、100％の幅では表示されません）が、スライダーの他の2つの画像は表示されません。

これは私が使用しているスタイルです：

.parallax { 
background-size:cover; 
min-height:1224px; 
overflow:auto; 
background-repeat: no-repeat; 
background-attachment: fixed; 
background-position: center center;} 

そして、これはhtmlですが：

<div id="carousel"> 
<ul class="bxslider">     
    <li class="parallax" style="background-image:url(images/test2.jpg);"> 

     <div class="parallax" style="border: 1px solid red; background-image:url(images/test2.jpg);">...</div> 

    </li> 
    <li class="parallax" style="background-image:url(images/test2.jpg);"> 

     <div class="parallax" style="border: 1px solid red; background-image:url(images/test2.jpg);">...</div> 

    </li>  
    <li class="parallax" style="background-image:url(images/test2.jpg);"> 

     <div class="parallax" style="border: 1px solid red; background-image:url(images/test2.jpg);">...</div> 

    </li> 
</ul> 

私はリンクがあるかどうかわからないんだけど許可されていますが、私が取り組んでいるページはここに見ることができます：http://ldswebsites.co.uk/intone/test.html

カルーセルの画像が表示されたときのように問題を引き起こしているのは修正されていますが、画像の残りの部分には視差の影響がありません。これを行う別の方法がありますか？事前に

感謝:)

Answer 1

著者はこの問題を修正するので、
彼の答えを投稿していなかった、私は削除背景-添付ファイル：それは問題
とI をcousingしたため、を固定視差画像をシミュレートする関数を追加しました。

function parallax(){ 
    var scrolled = $(window).scrollTop(); 
    $('myBxSlider li').css('background-position',"0 "+ (scrolled * 1) + 'px'); 
} 
$(window).scroll(function(){ 
    parallax(); 
}); 

私は、このリンクから、このコードをコピー：https://www.sitepoint.com/community/t/translate-3d-fixed-background-on-slick-slide/244637/7
RyanReese