Responsive background image
Forum rules
PLEASE READ THE FORUM RULES BEFORE YOU POST:
viewtopic.php?f=12&t=1901
MUST READ:
http://www.wysiwygwebbuilder.com/respon ... esign.html
Please read this first before posting any questions! Also check out the example project to get an idea how the RWD concept works.
Responsive Web Design FAQ:
http://wysiwygwebbuilder.com/forum/view ... 10&t=63817
PLEASE READ THE FORUM RULES BEFORE YOU POST:
viewtopic.php?f=12&t=1901
MUST READ:
http://www.wysiwygwebbuilder.com/respon ... esign.html
Please read this first before posting any questions! Also check out the example project to get an idea how the RWD concept works.
Responsive Web Design FAQ:
http://wysiwygwebbuilder.com/forum/view ... 10&t=63817
Responsive background image
Is there an option to have a background image on a page adapt it's size according to the browser size viewing it without using breakpoints
Re: Responsive background image
Set the background image to 'cover' and set the horizontal & vertical to 'center'
Re: Responsive background image
What tool in the toolbox would I use to place the picture that will give me those options
Re: Responsive background image
If you want the whole background of the page, go to page properties, style tab and choose image.
You can also set the background of a layer/layout grid by doing the same.
You can also set the background of a layer/layout grid by doing the same.
Re: Responsive background image
On a blank page I insert a 'Layout Grid'
In 'Object Properties/General' I remove one column.
In 'Object Properties/Style/Background/Mode' I select image and then select my image from folder.
In 'Size' I select 'contain'
then set H & V to center
nothing appears on preview and on page the LayoutGrid is only 60H
what am I missing here
In 'Object Properties/General' I remove one column.
In 'Object Properties/Style/Background/Mode' I select image and then select my image from folder.
In 'Size' I select 'contain'
then set H & V to center
nothing appears on preview and on page the LayoutGrid is only 60H
what am I missing here
Re: Responsive background image
A Layout grid without content will have no height.
The reason why you see it in the workspace is because otherwise you would not be able to drag any objects in it.
The reason why you see it in the workspace is because otherwise you would not be able to drag any objects in it.
Re: Responsive background image
Yes I know.
Do you have any documentation step by step procedures to carry out this function.
I want one thing on the page: a photo displayed that will be responsive to browser size.
Image is 3749X2500 if that is a concern
Do you have any documentation step by step procedures to carry out this function.
I want one thing on the page: a photo displayed that will be responsive to browser size.
Image is 3749X2500 if that is a concern
Re: Responsive background image
1. Open the page properties -> Style
2. Set a background image
3. Set the background size to 'cover' (or 100% 100%)
For Layout Grids there are several example templates that have a responsive background image
http://wysiwygwebbuilder.com/templates8.html
2. Set a background image
3. Set the background size to 'cover' (or 100% 100%)
For Layout Grids there are several example templates that have a responsive background image
http://wysiwygwebbuilder.com/templates8.html
Re: Responsive background image
As a suggestion, you need to reduce the size and compress that image. It is way too big to use and will cause slower loading times.
Re: Responsive background image
Thanks Pablo, that was quick and easy. Works like a charm.
Re: Responsive background image
So I'm guessing this will not work with a 'master-page' as the background image is not content.Pablo wrote: ↑Fri Apr 19, 2019 8:57 pm 1. Open the page properties -> Style
2. Set a background image
3. Set the background size to 'cover' (or 100% 100%)
For Layout Grids there are several example templates that have a responsive background image
http://wysiwygwebbuilder.com/templates8.html
Re: Responsive background image
It also works wirh a master page.