Rellax parallax javascript plugin not working when applied to cards of wordpress theme

[joe-111]

So I am trying to intergrate the Rellax, parallax plugin into my Wordpress theme.

I have this code which is applying the 'rellax' class and adding a speed to each card randomly:

$(document).ready(function(){

$('.card').each(function() {

$(this).addClass("rellax");
$(this).attr({'data-rellax-speed' : (Math.random() * 20) - 10})

 });
 });

Which is applying, when I go to inspect on chrome, I can see these edits have been applied:

<div class="card mb-4 rellax" data-rellax-speed="-6.145840407463368" style="left: 51.2957%; top: -49.8041px;">

(I also have a bit of javascript applying randomised placement)

But it isn't effecting the way my cards scroll?

I was thinking it was a problem with the css properties of the .card , or the div that surrounds them (.container pt-5 pb-5) , maybe it was contradicting / blocking what the rellax plugin wants to do..

.. so I did a test on my front-page, with some new divs, with the same classes applied, and nested in the same div wrapper that the cards on my pages are:

<div class="container pt-5 pb-5">

 <h1><?php the_title();?></h1>

 <div class="card mb-4 rellax one" data-rellax-speed="6"> Faster </div>

 <div class="card mb-4 rellax two"> No parallax </div>

 <div class="card mb-4 rellax three" data-rellax-speed="-10"> Slower </div>

 </div>

And this was working. So how come it isn't working on my cards in my theme? Is it applying these speeds after it fires the command, so the cards miss the message?

Thanks !

[seiyria]

I'm not sure what repo you meant to open this on, but it's not this one.