Kessiah Posted July 14, 2020 Share Posted July 14, 2020 Site URL: https://oleander-wedge-k254.squarespace.com/ Hi there, I'm trying to add parallax scrolling into my site using the below code I found on a YouTube tutorial. Even though we've got the - height: 100% - bit in there ... 1. the background images only take up the top portion of the container on certain screen sizes 2. my foreground images come out HUMONGOUS on mobile (this is secondary and seems like a separate issue) Any advice on how to use parallax but keep the background images filling the height of the container in any viewing format? Thanks so much!! https://oleander-wedge-k254.squarespace.com/ Password: Kessiah Using this code (disabled on the site right now): <script src="https://cdn.jsdelivr.net/npm/simple-parallax-js@5.5.1/dist/simpleParallax.min.js"></script> <script> var images = document.querySelectorAll('.section-background img'); new simpleParallax(images, { scale: 1.5, delay: 3 }); </script> <style> .simpleParallax ( height: 100% ) </style> Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment