Make Image full height of screen

All WYSIWYG Web Builder support issues that are not covered in the forums below.
Forum rules
IMPORTANT NOTE!!

DO YOU HAVE A QUESTION OR PROBLEM AND WANT QUICK HELP?
THEN PLEASE SHARE A "DEMO" PROJECT.



PLEASE READ THE FORUM RULES BEFORE YOU POST:
http://www.wysiwygwebbuilder.com/forum/viewtopic.php?f=12&t=1901

MUST READ:
http://www.wysiwygwebbuilder.com/getting_started.html
WYSIWYG Web Builder FAQ
Post Reply
User avatar
atb
 
 
Posts: 35
Joined: Tue Jan 19, 2010 10:18 pm

Make Image full height of screen

Post by atb »

Hello,
I just can't work this out and I'm sure there's a simple answer!.....

I have a very wide image that I would like to be responsive to fit full height of the screen and then keeping the aspect ratio be able to scroll horizontally.
Hope that makes sense!

Thanks
ATB
User avatar
crispy68
 
 
Posts: 2908
Joined: Thu Oct 23, 2014 12:43 am
Location: Acworth, GA
Contact:

Re: Make Image full height of screen

Post by crispy68 »

If the image is set as a background of layer, set it to 'cover'. This will make sure it fits the entire layer horizontally and keep the aspect ratio. It's the same for the page background in the page properties.
User avatar
atb
 
 
Posts: 35
Joined: Tue Jan 19, 2010 10:18 pm

Re: Make Image full height of screen

Post by atb »

Thanks for your reply crispy,
What I want is to have the image fill the screen vertically and then the user be able to scroll left and right to view the rest of the image.

Specifically, I'm trying to get it to work on a phone using a 320px breakpoint so the image fits the full height of the page and then can be 'swiped' left and right to see the rest of the image.
User avatar
atb
 
 
Posts: 35
Joined: Tue Jan 19, 2010 10:18 pm

Re: Make Image full height of screen

Post by atb »

Still can't get this to work...

I can get the image to fill the screen vertically, but can't scroll left-right or I can get it to scroll left-right but not fill the screen.

Does anyone have any suggestions?

Thanks in advance
User avatar
Pablo
 
Posts: 22429
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: Make Image full height of screen

Post by Pablo »

Do you have an example of what you are trying to do?
User avatar
atb
 
 
Posts: 35
Joined: Tue Jan 19, 2010 10:18 pm

Re: Make Image full height of screen

Post by atb »

hello Pablo
This here has a layer with the background set with the image.
the layer mode is Floating Layer
Floating mode is Default
I have the background image size set to Cover
the page properties - page alignment I have set page width and height to 100%

I can either get it to show the full image by scrolling left-right but not fit the full hight of the screen vertically.
OR
Fit the full screen height vertically but can't scroll left-right.

I cant get it to do both.

On a desktop type monitor its not too bad but on a mobile phone screen the image is reduced in size considerably.

is it possible?
User avatar
Pablo
 
Posts: 22429
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: Make Image full height of screen

Post by Pablo »

There is no way to add a vertical scrollbar to the image only.
But you can try to put it inside an inline frame.
The inline frame should be inside a layout grid to make it flexible.
User avatar
atb
 
 
Posts: 35
Joined: Tue Jan 19, 2010 10:18 pm

Re: Make Image full height of screen

Post by atb »

Thanks Pablo
I think thats got it :)
Post Reply