Lay Theme Forum

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

    Carousel 100vh on mobile not working

    General Discussion
    9
    31
    667
    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.
    • M
      melo_lenosier last edited by

      Hello everybody,

      I did this single row page where inside there is only the fantastic LT Carousel in 100vh height. Everything works perfectly on Desktop, no extra top or bottom padding. No overflow. Cool! But when you switch to Mobile there this annoying scroll due to I dont know what.
      You can see it here, please use the mobile to check it because from the desktop browser inspector seems fine.
      I have already set Use Browser Height for Row Height and the Top and Bottom margin to zero.

      By doing various tests I tried to enable the Fullscreen Slider and set its direction to Horizontal. For making it working I had to add another Row, but in this way the Carousel height was perfectly stuck, zero overflow! But this system was not working for me because I just need one Row for one Carousel.

      So, is there a way to have the Carousel perfectly stuck at 100vh as it works in the Fullscreen Slider?

      Hope you understand my point :)

      Thank guys,
      melo

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

        Dear @melo_lenosier
        the carousel works fine on mobile with 100vh.

        Can you show a screenshot?

        Best!

        Marius

        www.mariusjopen.world

        1 Reply Last reply Reply Quote 0
        • M
          melo_lenosier last edited by

          It works, ok, but it's not properly fixed as when you active the Fullscreen slider with the direction set to Horizontal. Indeed now you can scroll up and down a little bit, but that should not happen. The hoverflow should be completely hidden. You know what I mean?

          Here you can see it in a video.

          Thanks

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

            Dear @melo_lenosier
            ok. Thank you for sharing.
            We will look into this.

            Best!

            Marius

            www.mariusjopen.world

            1 Reply Last reply Reply Quote 0
            • M
              melo_lenosier last edited by melo_lenosier

              Ok, please let me know!

              Meanwhile I wanted to know if at the moment there are any alternative solutions.
              For example, if I use the Carousel while enabling the Fullscreen Slider it work perfectly, it doesn't overflow vertically (here). The only problem is that, in order to make the Fullscreen slider working, I have to insert 2 Rows and in this way there are problems when swiping from left to right because one Row has the Carousel with all the images inside and the other Row has just one image inside another Carousel.
              I wonder if there is a way to make the Fullscreen slider working with just one Row. That would solve the problem. Or maybe having 2 Rows but one should be set in display:none (but probably is not that easy).

              Hope you understand what I meant.
              Thanks again!

              melo

              1 Reply Last reply Reply Quote 0
              • edgrbnz
                edgrbnz last edited by

                Just asking:

                Do you have a different frame set for the mobile version of the site in question? The frame adds to the height so that might be an issue.

                ✦ ✦ ✦

                1 Reply Last reply Reply Quote 0
                • M
                  melo_lenosier last edited by melo_lenosier

                  Nothing of that kind. Everything is set the same: 0 margin or padding.
                  It's a Carousel problem.
                  But thanks for checking! :)

                  1 Reply Last reply Reply Quote 1
                  • edgrbnz
                    edgrbnz last edited by

                    Well then this is obviously a bug…

                    ✦ ✦ ✦

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

                      Dear @melo_lenosier
                      we will look into this!

                      Best!

                      Marius

                      www.mariusjopen.world

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

                        Yea, will try to fix this soon!

                        1 Reply Last reply Reply Quote 0
                        • M
                          melo_lenosier last edited by

                          Danke schön!

                          1 Reply Last reply Reply Quote 0
                          • H
                            hddunlap last edited by

                            @melo_lenosier Was this issue ever resolved? I am running into the same problem myself.

                            1 Reply Last reply Reply Quote 0
                            • U
                              User4000 last edited by

                              Hello to everybody, I have the same issue, any updates?
                              thank you

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

                                Dear @melo_lenosier
                                we are looking right now into the carousel issues.

                                Best!

                                Marius

                                www.mariusjopen.world

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

                                  links guys?

                                  you might need to do

                                  body {
                                      padding-top: 0!important;
                                  }
                                  

                                  in lay options → custom html & css → custom css for mobile

                                  usually there will be a space at the top so the content does not start underneath the mobile menu bar. this could be the issue.

                                  if that doesn't fix it for you, post your website link here

                                  1 Reply Last reply Reply Quote 0
                                  • U
                                    User4000 last edited by

                                    I don't have set a website already i just try this function and make the same issue of this video posted by @melo_lenosier before.
                                    i try the strings for padding 0 but doesn't work (i have an iphone6s).

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

                                      ok so on an iphone, 100vh is actually the height of the browser + the top and bottom browser bars.

                                      so the issue is not that the row/carousel is not set to browser-height, the issue is that on an iphone safari, browserheight is interpreted differently.

                                      also it is interpreted differently for an iphone with a home-button and one without a homebutton.

                                      you can try and create a custom phone layout and then use: "100vh - 110px" as your carousel fixed height. also make sure in that row, don't have your row be "browser height"

                                      1 Reply Last reply Reply Quote 0
                                      • U
                                        User4000 last edited by

                                        Hi @arminunruh thanks, I try it, but also this doesn't work. The final target is to create a carousel that can swipe horizontal, with show multiple slides, like in the desktop view (where is perfect) but in the mobile view. Have you other ideas to create it?

                                        Thanks

                                        1 Reply Last reply Reply Quote 0
                                        • U
                                          User4000 last edited by

                                          I send you a screen to see the settings i check for desktop and doesn't work the same on mobile.
                                          Screenshot 2020-01-29 at 17.00.00.png I try also with 100vh - 110px and with free drag selected but not work.

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

                                            hey everybody

                                            So i just released an update for both laytheme and the carousel plugin. Please update both.

                                            Now in your carousel, as your fixed height, write: 100vh

                                            Let me know if it works, if it doesn't do the trick, post the link to where you have the problem. Thx

                                            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

                                            Recent Topics

                                            • T

                                              OpenType Feature

                                            • T

                                              Split Screen just on front page / subpages without the split?

                                            • T

                                              problem when I click on the category filter buttons on mobile

                                            • G

                                              z index has different behaviors on different pages

                                            laytheme.com