Background to cover on anything less than desktop

All WYSIWYG Web Builder support issues that are not covered in the forums below.
Forum rules
PLEASE READ THE FORUM RULES BEFORE YOU POST:
viewtopic.php?f=12&t=1901

MUST READ:
http://www.wysiwygwebbuilder.com/getting_started.html
WYSIWYG Web Builder FAQ
Post Reply
Trugmaker
 
 
Posts: 135
Joined: Mon Mar 23, 2015 3:11 pm
Location: East Sussex UK
Contact:

Background to cover on anything less than desktop

Post by Trugmaker » Mon Jan 21, 2019 4:13 pm

My Index webpage background is an image. When viewed on a desktop it is perfect but when viewed on a mobile only the lower part of the image shows and does not cover the whole page. Is it possible to have the image both whole and stationary while scrolling?
Never complain about getting old, the alternative is far worse!

User avatar
Pablo
 
Posts: 18768
Joined: Tue Mar 28, 2006 12:00 pm
Location: Europe
Contact:

Re: Background to cover on anything less than desktop

Post by Pablo » Mon Jan 21, 2019 4:46 pm

What is the URL of the page and where exact do I need to look?
What are your exact settings?

Trugmaker
 
 
Posts: 135
Joined: Mon Mar 23, 2015 3:11 pm
Location: East Sussex UK
Contact:

Re: Background to cover on anything less than desktop

Post by Trugmaker » Mon Jan 21, 2019 6:41 pm

www.hellinglylions.org

Settings:- Style - Mode Image - Do not Repeat - Center - Cover
Never complain about getting old, the alternative is far worse!

User avatar
Pablo
 
Posts: 18768
Joined: Tue Mar 28, 2006 12:00 pm
Location: Europe
Contact:

Re: Background to cover on anything less than desktop

Post by Pablo » Mon Jan 21, 2019 6:50 pm

"cover + fixed" is not supported by some mobile browsers:
See 'known issues'
https://caniuse.com/#search=background-size

If you use breakpoints then you can set a different background mode for smaller screens.

User avatar
rogerl
 
 
Posts: 246
Joined: Tue May 03, 2016 8:24 am

Re: Background to cover on anything less than desktop

Post by rogerl » Mon Jan 21, 2019 11:01 pm

Hi Trug - I had similar issues when I converted to handle mobile and found this extension that sorted most of my issues;
Author Nathan Hill
Android - iphone Full Screen Background
https://www.magicwebdesigners.com/wysiw ... ground.php
$10 US
Small price to pay for peace of mind
There are a couple of others around, but this one was the only one that seemed to work in all the situations I found.

User avatar
zinc
 
 
Posts: 1343
Joined: Sat Dec 08, 2007 3:06 pm
Location: London, United Kingdom

Re: Background to cover on anything less than desktop

Post by zinc » Tue Jan 22, 2019 8:09 am

...
Last edited by zinc on Fri Feb 01, 2019 8:35 am, edited 1 time in total.

Trugmaker
 
 
Posts: 135
Joined: Mon Mar 23, 2015 3:11 pm
Location: East Sussex UK
Contact:

Re: Background to cover on anything less than desktop

Post by Trugmaker » Tue Jan 29, 2019 6:00 pm

Thanks RogerI - did everything I wanted and incredibly simple, took literally less than a minute to achive, as you suggest $10 small price to pay! :D
Never complain about getting old, the alternative is far worse!

User avatar
rogerl
 
 
Posts: 246
Joined: Tue May 03, 2016 8:24 am

Re: Background to cover on anything less than desktop

Post by rogerl » Tue Jan 29, 2019 10:22 pm

Great! Glad it worked for you. Making things work properly on mobile can be a frustrating exercise.

Trugmaker
 
 
Posts: 135
Joined: Mon Mar 23, 2015 3:11 pm
Location: East Sussex UK
Contact:

Re: Background to cover on anything less than desktop

Post by Trugmaker » Wed Jan 30, 2019 6:08 pm

Any more tips like that Roger?
Never complain about getting old, the alternative is far worse!

User avatar
rogerl
 
 
Posts: 246
Joined: Tue May 03, 2016 8:24 am

Re: Background to cover on anything less than desktop

Post by rogerl » Wed Jan 30, 2019 11:11 pm

Depends what path you've gone. I used break points, it just seemed simpler than trying to get my head around some of the new stuff. I use layers as my header / banner and ran into problems there - used media queries to sort that. It's all about coping with portrait verses landscape since the page is re-written when person turns the mobile around. For those pages where I decided not to have bps I found a bit of code to force the layer across full screen width.
Text in different browsers displays differently so had to allow more area in text objects to ensure they displayed correctly.
I use a lot of lightbox type screens and had a few issues using magnific popup. Used an extension "jor_magnificManipulation" with some direct help from Jordon fixing some issues related to how I use the software.
"Google" and this Forum also research in "Github" , "Stack Overflow" and direct help from Janis of "Fancybox" all contributed to my conversion. I'm a lot greyer than I used to be, but still an interesting exercise that needs time and patience.

Post Reply