Parallax.js: Image not showing up

Question

I'm using parallax.js to give a parallax effect to my images. I have one background image and one layer image. I tried to follow a tutorial on Youtube but the images don't seem to show up. I have gone through other similar questions and tried their solutions to no avail. I tried removing background color of the body suggested by other posts but it doesn't change anything.

Here is the HTML:

<div class="container">
         <ul id="scene">
            <li class="layer" data-depth="0">
                <img src="images/PS.png" alt="">
            </li>
        </ul>
 </div>  

CSS:

.container {
    margin: 50px 0;
    background: url(../images/PSbg.png);
    width: 100%;
    height: 897.42px;
}

.container img {
    z-index:1;
}