katieelder

hello @bangank36 I have tried what you suggested at the beginning on the footer but I still cannot see the images? <script src="https://code.jquery.com/jquery-3.6.1.min.js"></script> <script> $('.has-background:not(:has(.sqs-video-background))').each(function() { var findImage = $(this).find('.section-background img'); var imgUrl = findImage.data('src') + '?format=2500w'; var dimensions = findImage.data('image-dimensions'); var imgWidth = dimensions.substr(0, dimensions.indexOf('x')); var imgHeight = dimensions.substr(dimensions.indexOf('x') + 1); $(this).parallax({ bleed: 0, imageSrc: imgUrl, naturalWidth: imgWidth, naturalHeight: imgHeight, speed: .2, }) }); document.getElementsByTagName("body")[0].onresize = function() { setTimeout(function() { jQuery(window).trigger('resize').trigger('scroll') }, 100) }; </script> <style>.has-background{background-color:transparent!important}.has-background .section-background{background-color:transparent!important}.has-background .section-background img{visibility:hidden!important}.has-background.background-width--inset{margin:4vw;padding:0!important}.has-background.background-width--inset:not(.content-collection):not(.gallery-section) .section-background{top:0!important;right:0!important;bottom:0!important;left:0!important}</style> I got the original code from this website https://stnsvn.com/blog/how-to-add-parallax-scrolling-squarespace-7-1 What am I doing wrong? Thanks!

Site URL: https://www.katherineelder.com/ Hello, A while back I added the following coding to my website to create parallax in the background images. Yesterday I changed the header image on the shop page and all the section background images have gone and I don't know why. Please could you help me? Current Code Injections. HEADER <style> body.header--menu-open .header-title { filter: unset !important; } body.header--menu-open header#header img { content: url(https://static1.squarespace.com/static/60e2168480601f08e2ae389e/t/627bc5bf85a284571e186ead/1652278719894/Katherine_Elder_logo_sky.png) !important; } </style <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <script src="https://cdn.jsdelivr.net/parallax.js/1.4.2/parallax.min.js"></script> FOOTER <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <script src="https://cdn.jsdelivr.net/parallax.js/1.4.2/parallax.min.js"></script> <script> $('.has-background:not(:has(.sqs-video-background))').each(function() { var findImage = $(this).find('.section-background img'); var imgUrl = findImage.data('src') + '?format=2500w'; var dimensions = findImage.data('image-dimensions'); var imgWidth = dimensions.substr(0, dimensions.indexOf('x')); var imgHeight = dimensions.substr(dimensions.indexOf('x') + 1); $(this).parallax({ bleed: 0, imageSrc: imgUrl, naturalWidth: imgWidth, naturalHeight: imgHeight, speed: .2, }) }); document.getElementsByTagName("body")[0].onresize = function() { setTimeout(function() { jQuery(window).trigger('resize').trigger('scroll') }, 100) }; </script> <style>.has-background{background-color:transparent!important}.has-background .section-background{background-color:transparent!important}.has-background .section-background img{visibility:hidden!important}.has-background.background-width--inset{margin:4vw;padding:0!important}.has-background.background-width--inset:not(.content-collection):not(.gallery-section) .section-background{top:0!important;right:0!important;bottom:0!important;left:0!important}</style> Thanks!!

Site URL: https://www.katherineelder.com/ Hello, I would like for the gallery in page 'conact' at the top and 'bespoke' at the bottom to be displayed the tree of them together in a row to avoid one hanging down on mobile view. Is this possible with css? password: KatieElder2022 thanks!