nevermind! I got it to work by taking the image out of the banner and setting background properties with CSS. I've seen some other folks struggling with this so here's what worked for me:
CSS
#page{
background: #cacaca;
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
background-blend-mode: multiply;
}
-style your background however you want. I like the parallax effect and added an overlay so the text on top would stand out more
footer code injection:
<script type="text/javascript">
var images = ['image.jpg', 'image2.jpg', 'image3.jpg', 'image4.jpg', 'image5.jpg'];
document.getElementById("page").style.backgroundImage = 'url(" ' + images[Math.floor(Math.random() * images.length)] + '")';
</script>
-you'll have to find the urls for your images and replace image.jpg above with the full url, and replace "page" with whatever your page id is.
good luck!