Pauline-lali Posted October 25 Share Posted October 25 I have this page on my Squarespace website with a background image that displays perfectly on Android and PC but over zoomed and blurred on iOS/iPhone. It's a custom coding so I need help from anyone who has had the same experience or knows how to resolve it. Thank you. Pauline. iamfatima 1 Link to comment
Ziggy Posted October 25 Share Posted October 25 Can you share the website URL and this page, as well as the code? Can't help without that. iamfatima 1 Please like and upvote if my comments were helpful to you. Cheers! Zygmunt Spray Squarespace Website Designer Contact me: https://squarefortytwo.com 🔌 Ghost Squarespace Plugins (Referral link) 📈 SEO Space (Referral link) ⬛ SquareWebsites Plugins (Referral link) ✨ Spark Plugin (Referral link) ☕ Did I help? Buy me a coffee? Link to comment
Pauline-lali Posted October 25 Author Share Posted October 25 @Ziggy https://www.dannyprose.com/projects/nike here is the code for the project page: //Project Theme: Nike: North American Digital Brand; //Add body's collection ID to this selector body#collection-63eb05496c32917ee0e8dd89 { //Theme Varibales @theme-background-color: none; @theme-background-url: "http://dannypalmer.squarespace.com/assets/images/projects/nike-nadb/Project - Nike - NADB.jpg"; @theme-text-color: white; @gallery-image-border-color: none; @theme-navigation-desktop-background-color: #4983a4; @theme-navigation-desktop-link-color: none; //Mobile Background fix background-size: cover !important; background-repeat: no-repeat !important; // background-position: cover cover !important; //what was there before background-position: center !important; //opened when .project-themes(); // background-size: cover } @media (max-width: 575px) { body#collection-63eb05496c32917ee0e8dd89 { background-position: 80% top !important; } } Link to comment
Ziggy Posted October 26 Share Posted October 26 I'm not sure I see the problem you're having, the background image looks fine on mobile considering what it is on desktop. You have a problem with the URL in this code, you can't have spaces in a URL: I would suggest checking this and putting in the correct working URL. Please like and upvote if my comments were helpful to you. Cheers! Zygmunt Spray Squarespace Website Designer Contact me: https://squarefortytwo.com 🔌 Ghost Squarespace Plugins (Referral link) 📈 SEO Space (Referral link) ⬛ SquareWebsites Plugins (Referral link) ✨ Spark Plugin (Referral link) ☕ Did I help? Buy me a coffee? Link to comment
Pauline-lali Posted October 27 Author Share Posted October 27 If you view the website on Android, there's no issue but if you view it on iPhone and observe the background image, you will see that it's over-zoomed and blurred. 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