Search code examples
javascripthtmlcordovaparallax

Parallax not working in materialize css

I am using the Materialize Framework to create a PhoneGap app.

http://materializecss.com

They have a parallax setting which you can see their notation here:

http://materializecss.com/parallax.html

When I run it, my image does not show up at all. My html looks like this:

<div class="row">
  <div class="col s12 m7">
    <div class="card">

      <div class="parallax-container" style = "height:100px;">
        <div class="parallax"><img src="/img.png"></div>
      </div>

      <div class="card-content">
        <h5> test</h5>
        <h6> test</h6>
        <h6> test </h6>
        </br>
        <p> test</p>
      </div>

      <div class="card-action">
        <a href="#">This is a link</a>
      </div>

    </div>
  </div>
</div>
Solution

  • Look my example: http://jsfiddle.net/yhgj48tr/

    Do not forget to initialize it:

    $(document).ready(function(){
  $('.parallax').parallax();
});