Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • October 25, 2016 at 9:36 pm #703981
    paullindqvist

    Hi!

    I need to make a page that display a single image that will fill the whole browser window.

    I’l hide the header and only have a footer.

    I need it to be responsive on both desktop and mobile.

    How would you advice doing this ?

    My solution for desktop is to use a color section and then add a white space as high as the image (in this case it’s a 1920x1080px image) which works ok.

    For mobile i use a redirect to be able to use another image (portrait orientation) i assume there is no way to get a different image to show on mobile devices ?

    Thanx!

    October 25, 2016 at 9:45 pm #703988
    Yigit

    Hi Paul!

    Please refer to this post – http://kriesi.at/documentation/enfold/color-section-with-100-container/ and create a color section with 100% container width and place your image element inside it :)

    Cheers!
    Yigit

    October 25, 2016 at 9:59 pm #704006
    paullindqvist

    Thank you!

    I added the ID and the quickcode, is the white space solution the best option to get it to display the right hight ?

    Also now when having a window that is longer the top is cut off.

    Please see the test page here:

    start 2

    Thanx!

    October 26, 2016 at 4:42 pm #704414
    Yigit

    Hi!

    1- Yes, you can set your color section to display the height of its content by simply editing it.

    2- Have you figured this one out already? Your page looks fine on my end :)

    Regards,
    Yigit

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.