Adding multiple layers

Question

I'm using the framework Cool Kitten for a parallax project (because it's responsive). This framework is using stellar.js, which supports multiple parallax layers. Cool Kitten doesn't provide any documentation, and it's not possible to use the documentation to stellar.js straight off.

What I want is to have three parallax layers but I just can't figure out how to do it with Cool Kitten.

According to stellar.js docs you do it like this...

<div class="slide" id="slide3" data-slide="3" data-stellar-background-ratio="0.5">
    <div class="wrapper">
        <img src="images/slide3/freelance.png" data-stellar-ratio="1.4" data-stellar-vertical-offset="-102"alt="">
        <img src="images/slide3/psdtuts.png" data-stellar-ratio="1.5" data-stellar-vertical-offset="-53"alt="">
        <img src="images/slide3/rockable.png" data-stellar-ratio="2.7" data-stellar-vertical-offset="-200"alt="">
        <img src="images/slide3/themeforest.png" data-stellar-ratio="3" data-stellar-vertical-offset="-200"alt="">
        <img src="images/slide3/tutshub.png" data-stellar-ratio="1" data-stellar-vertical-offset="-200"alt="">
        <img src="images/slide3/psdtuts.png" data-stellar-ratio="1.5" data-stellar-vertical-offset="-200"alt="">
    </div>

    <span class="slideno">Slide 3</span>
    <a class="button" data-slide="4" title=""></a>

</div>

...but when trying this code out with Cool Kitten it doesn't work, and the images is shown side by side without any parallax effect at all.

So, how can one add multiple parallax layers with Cool Kitten?

Answer 1

Cool Kitten has a lot of potential, but it is still in the beta phase and lacks a few features, such as supporting multiple parallax layers (which it does not). I do hope that this is something that they will add in a future release of the framework.

References: Here, and Here