parallax.js視差 - 滑塊視差內容和圖像

Question

http://pixelcog.github.io/parallax.js/

你好，世界！ 我上面的插件有問題。 我已經設法制作了幾個視差背景並且可以用內容填充它們沒有問題但是在文檔中它提到能夠使用視差層類對內容使用視差效果，當我將它添加到我的代碼時整個部分變成空白。 當我刪除視差層div時，我的代碼再次起作用但最終我想用視差效果影響內容，就像我對圖像一樣。 誰知道我做錯了什么？ 謝謝 ：）

繼承人的HTML ...

<div class="parallax-window" data-parallax="scroll" data-image-src="background.jpg" style="padding:20px 30px;">
    <div class="parallax-slider">
<h1 style="color:rgba(255,255,255,1);font-size:10vw;margin:0;padding:0;text-shadow:-10px 10px 15px rgba(20,0,20,1);">Wally Gunn</h1>
    </div>
</div>

而css ......

.parallax-window {
    min-height: 400px;
    background: transparent;
}

我也把這個劇本粘貼在我的身體底部

<script>
$('.parallax-window').parallax({
naturalWidth: 600,
naturalHeight: 400});
</script>

Answer 1

我解決了這個問題...使用：

<div class="parallax-window" data-parallax="scroll" data-image-src="https://tse1-mm.cn.bing.net/th?id=OIP.3iTMNkANw-FFI-x8vJqD4wHaDF&p=0&o=5&pid=1.1" data-z-index="-1">
    <div class="text">
        <h1>Simple Parallax Scrolling</h1>
    </div>
</div>

記得將data-z-index為-1 ，並顯示parallax-window元素。