ChrisMonarch Posted December 8, 2020 Share Posted December 8, 2020 Site URL: https://www.wildlife.co.nz/wildlife-cruise-1 Hi, I am trying to figure out how to use a media query to resize page banners to be a full width image on mobile view. The banners won't have text or buttons on them. I just want them to be a full width image that has the parallax effect as the user scrolls down the page. I want to be able to do this on multiple pages on my website. Example page: www.wildlife.co.nz/wildlife-cruise-1 Squarespace 7.0 | Mojave template @tuanphan I've seen you respond to others but the code you've provided them hasn't worked for me. Please help. Thanks in advance! Link to comment
tuanphan Posted December 9, 2020 Share Posted December 9, 2020 Edit above page settings > Advanced > Header <style> @media screen and (max-width:640px) { .Parallax-item:first-child img { width: 100% !important; height: auto !important; left: 0 !important; top: 0 !important; } .Parallax-item:first-child figure { transform: unset !important; } section#new-page-54 { min-height: unset !important; height: 250px; } } </style> Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
ChrisMonarch Posted December 9, 2020 Author Share Posted December 9, 2020 Thank you! It doesn't seem to keep it's parallax qualities. Is that to be expected? Link to comment
tuanphan Posted December 11, 2020 Share Posted December 11, 2020 Yes. above code will disable Parallax on mobile. To keep Parallax, try remove this line Quote .Parallax-item:first-child figure { transform: unset !important; } ChrisMonarch 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care 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