juris_adventure Posted November 5, 2023 Share Posted November 5, 2023 Hello, I have a problem with parallax scrolling on my website. Since I don't like Squarespace's integrated Parallax effect on images because it cuts off the images and changes the quality, I created it with extra code in the Website Fooder. For some reason, the second image in my slider is always cut off on my homepage. As soon as you move the mouse just a little, the image adjusts and it works again. If you reload the page, the error is there again. I use the following code. <!--Parallax Scrolling--> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/scrollax@1.0.0/scrollax.min.js"></script> <script> $('.has-background').attr('data-scrollax-parent', 'true'); $('.has-background .section-background').attr('data-scrollax', 'properties: { translateY: "30%" }'); $.Scrollax(); </script> <style> .has-background {overflow: hidden;} </style> If I take out the code, you can see the entire image, but of course the effect is missing. Maybe someone knows what it is? 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