Lay Theme Forum

    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Popular
    • Users
    • Search

    Website with vertical images | scroll to different sections

    General Discussion
    2
    8
    542
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • R
      robsdonatini last edited by

      Hello there, thank you in advance for your precious help without which I would be lost. I tried to find already existing discussion, but maybe I don't know what is the name of what I'm looking for.

      I would like to do a part of a website like this http://nadinegoepfert.com/
      with images that occupy the whole viewport height in background, one after the other, the thing is that I want to use a part of the width white to have text because my image is vertical so it will be dyptics text + image. What is the best way to achieve this? Should I upload a background with already a white part where i will put my text after (see attached) or is there a way to make an image the whole height of the browser and put some text centered next to it so that the white space becomes "responsive" with the reduction of the browser width?

      Plus: do you know which effect is the one Nadine Goepfert's website is using to pass from one section to the other? Is not parallax, isn't it?

      Thank you a lot

      roberta
      0_1523394003725_Schermata 2018-04-10 alle 22.58.12.png

      1 Reply Last reply Reply Quote 0
      • R
        robsdonatini last edited by

        the idea i have is kind of this (done uploading an image with white space on the left)

        http://www.theamikkelsen.com/category/what

        psw: theatest

        1 Reply Last reply Reply Quote 0
        • mariusjopen
          mariusjopen Global Moderator last edited by

          Dear @robsdonatini

          Yes, there are a couple of ways to achieve this:

          1. Like you said with the white image background. For the mobile version you can insert a different image.
          2. CUSTOM CSS: You can style the background image with css that it only takes half of the screen.

          Best!

          Marius

          www.mariusjopen.world

          1 Reply Last reply Reply Quote 0
          • R
            robsdonatini last edited by

            ehi @mariusjopen thanks, but you did not mentioned the part of the scrolling down as Nadine Goepfert.. how can I achieve that effect of transition?

            Is there a code I can use?

            thanks

            roberta

            1 Reply Last reply Reply Quote 0
            • R
              robsdonatini last edited by robsdonatini

              I got it... it's a full screen slider! but the thing i do not get is that with her website you just have to touch slightly the trackpad and you go down, while when I do it it hesitate between one slide and the other... mmm..

              1 Reply Last reply Reply Quote 0
              • mariusjopen
                mariusjopen Global Moderator last edited by

                Dear @robsdonatini

                happy to hear it works now.

                Can you post a link to your slow fullscreen slider?

                Best!

                Marius

                www.mariusjopen.world

                1 Reply Last reply Reply Quote 0
                • R
                  robsdonatini last edited by

                  dear @mariusjopen here it is: http://www.theamikkelsen.com/expertise_old

                  i also changed the scrolling speed. but i do not achieve the same effect as the website of http://nadinegoepfert.com/

                  thanks

                  1 Reply Last reply Reply Quote 0
                  • mariusjopen
                    mariusjopen Global Moderator last edited by

                    Dear @robsdonatini
                    this is probably because some of your pages are longer than the browser-height.

                    Then it needs a longer scroll.

                    At Nadines page all the pages have a exact browser height.

                    Best!

                    Marius

                    www.mariusjopen.world

                    1 Reply Last reply Reply Quote 0
                    • First post
                      Last post

                    Before you post

                    Use the Search Feature. Maybe there is already a solution to your issue.

                    1. Update Lay Theme and all Lay Theme Addons
                    2. Disable all Plugins
                    3. Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code ", click "Save Changes"
                    4. Now see if your problem solved itself
                    5. Go here, see if your problem is listed here:
                    Troubleshooting

                    When you post:
                    1. Post a link to where the problem is
                    2. If the problem is difficult to explain, post screenshots / link to a video to explain it

                    Thanks!

                    Online Users

                    B
                    A
                    A
                    7
                    N
                    J
                    S
                    M
                    P

                    Recent Topics

                    • A

                      Theme crashed - because of Polylang?

                    • A

                      can't change front page

                    • M

                      komische boxen auf der Website

                    laytheme.com