Skip to content
  • Recent
  • Tags
  • Popular
  • Users
  • Search
Skins
  • Light
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Default (No Skin)
  • No Skin
Collapse

Lay Theme Forum

  1. Home
  2. General Discussion
  3. Carousel 100vh on mobile not working

Carousel 100vh on mobile not working

Scheduled Pinned Locked Moved General Discussion
31 Posts 9 Posters 1.7k Views
  • 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.
  • U Offline
    U Offline
    User4000
    wrote on last edited by
    #19

    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
    0
    • arminunruhA Offline
      arminunruhA Offline
      arminunruh
      Global Moderator
      wrote on last edited by
      #20

      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
      0
      • U Offline
        U Offline
        User4000
        wrote on last edited by
        #21

        Hi @arminunruh it seems to be perfect now! there is only the white space at the top and bottom if you try to scroll vertical, maybe is possible to deactivate the vertical? scroll function?

        Thanks a lot

        1 Reply Last reply
        0
        • D Offline
          D Offline
          DLB
          wrote on last edited by
          #22

          Hi @arminunruh

          Thanks for the updates!

          I still have an issue with the Carousel plugin on iOS / iPhone using the Safari browser, since yesterday’s updates. The fixed height does not display at 100vh – even though it’s set to that!

          I've also tested it on the iOS Chrome and Firefox browsers and they display the Carousel with a fixed height at 100vh perfectly – just doesn't work on iOS Safari for some reason?

          Prior to yesterday’s updates the Carousel worked fine for me at 100vh on iOS Safari.

          The Carousel 100vh works fine for me on desktop though, on macOS Safari, Chrome, and Firefox.

          Thanks again, for fixing the Carousel text slide positioning.

          Des

          1 Reply Last reply
          0
          • arminunruhA Offline
            arminunruhA Offline
            arminunruh
            Global Moderator
            wrote on last edited by
            #23

            do u have a link?¿

            1 Reply Last reply
            0
            • D Offline
              D Offline
              DLB
              wrote on last edited by
              #24

              Hi @arminunruh

              Link: https://deslloydbehari.co.uk/repository/

              1 Reply Last reply
              0
              • arminunruhA Offline
                arminunruhA Offline
                arminunruh
                Global Moderator
                wrote on last edited by
                #25

                :D

                nice website

                so, what exactly is browser height on an iphone safari,
                that's an interesting question

                look at this picture
                … ok i cant seem to upload images anymore, theres a bug in the forum.

                anyway, the problem is when you scroll down, the bars on the top and bottom of safari's browser are removed. so 100vh is actually different from when you scroll up and scroll down.

                the current 100vh is calculated for when the browser shows these bars

                i will think about a solution to this, i wrote it down

                1 Reply Last reply
                0
                • arminunruhA Offline
                  arminunruhA Offline
                  arminunruh
                  Global Moderator
                  wrote on last edited by
                  #26

                  ok,

                  here, a screenshot of the browser bars invisible:
                  IMG_5178.jpg

                  and here is a screenshot of the browser bars visible:
                  IMG_5177.jpg

                  1 Reply Last reply
                  0
                  • D Offline
                    D Offline
                    DLB
                    wrote on last edited by
                    #27

                    @arminunruh Thanks for checking — really appreciate it. Hope you’re able to find a solution soon. Thanks for the compliment too — it's a cool theme to work with!

                    1 Reply Last reply
                    0
                    • N Offline
                      N Offline
                      no_caller_id
                      wrote on last edited by
                      #28

                      Hi everyone, is there an update on this? I'm running into the same issue. Tried to fix it via THIS solution, however it didn’t work for me with just CSS.

                      How can I implement the Javascript solution in Lay Theme?

                      Thanks for your help!

                      1 Reply Last reply
                      1
                      • RichardR Offline
                        RichardR Offline
                        Richard
                        Global Moderator
                        wrote on last edited by
                        #29

                        Dear @no_caller_id

                        This was two years ago so just to clraify that it's about "space" that sometimes occurs at the bottom of a layout on Safari Mobile?

                        Are you able to post a link to your website with issue in question 🔍

                        I think Armin is looking into this as the new IOS has created some bugs with the Address/Navigation bar. Are you able to do some test to remove the menu bar in > Customize >

                        In the past this was the issue as the 100vh calculated the Menu Bar into it and created this space. (e.g 60px height of white space).


                        Talk soon & best wishes 🌻
                        Richard
                        N 1 Reply Last reply
                        1
                        • RichardR Richard

                          Dear @no_caller_id

                          This was two years ago so just to clraify that it's about "space" that sometimes occurs at the bottom of a layout on Safari Mobile?

                          Are you able to post a link to your website with issue in question 🔍

                          I think Armin is looking into this as the new IOS has created some bugs with the Address/Navigation bar. Are you able to do some test to remove the menu bar in > Customize >

                          In the past this was the issue as the 100vh calculated the Menu Bar into it and created this space. (e.g 60px height of white space).


                          Talk soon & best wishes 🌻
                          Richard
                          N Offline
                          N Offline
                          no_caller_id
                          wrote on last edited by
                          #30

                          Dear @Richard

                          Thanks for looking into this. Yes it is about the space that occurs at the bottom, causing the footer area to disappear behind the navigation elements (mainly a Safari issue, it is working without problem in Firefox and Chrome).

                          I also have the issue when viewing the website on my iPad.

                          I already have the menu bar on "hide" in the customization menu.
                          Besides that the only element is the carousel with 100vh.

                          The link to my website is here: www.robinbrass.com

                          Another issue I have is when creating longer captions, with possibly two lines when viewed in mobile, for the inidvidual images in the carousel. This causes all captions to add one empty line below the text, resulting in the text not sitting on the bottom.

                          In general, would you rather advise to use the Fullscreen Slider Plugin in for my purpose?

                          Thanks and best wishes,
                          R

                          1 Reply Last reply
                          0
                          • RichardR Offline
                            RichardR Offline
                            Richard
                            Global Moderator
                            wrote on last edited by
                            #31

                            Dear R

                            @no_caller_id

                            Best wishes, hope you had a nice holiday season 🌝

                            Regarding the space at bottom on Safari IOS, I believe Armin is aware of this along with a few other users with similar bug, so should be worked out soon.

                            "causes all captions to add one empty line below the text, resulting in the text not sitting on the bottom."

                            Screen Shot 2022-01-05 at 12.29.23 PM.png

                            The Single line captions you have sit higher - Should the two line comments on Mobile also sit higher?


                            Have a wonderful start to 2022 ✨
                            Richard
                            1 Reply Last reply
                            1
                            Reply
                            • Reply as topic
                            Log in to reply
                            • Oldest to Newest
                            • Newest to Oldest
                            • Most Votes


                            I also code custom websites or custom Lay features.
                            💿 Email me here: 💿
                            info@laytheme.com

                            Before you post:
                            1. When using a WordPress Cache plugin, disable it or clear your cache.
                            2. Update Lay Theme and all Lay Theme Addons
                            3. Disable all Plugins
                            4. Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code", click "Save Changes"

                            This often solves issues you might run into

                            When you post:
                            1. Post a link to where the problem is
                            2. Does the problem happen on Chrome, Firefox, Safari or iPhone or Android?
                            3. If the problem is difficult to explain, post screenshots / link to a video to explain it
                            Online Users
                            R
                            renno
                            C
                            cim_kb
                            Forgot your key, lost your files, need a previous Lay Theme or Addon version? Go to www.laykeymanager.com
                            laytheme.com
                            • Login

                            • Don't have an account? Register

                            • Login or register to search.
                            • First post
                              Last post
                            0
                            • Recent
                            • Tags
                            • Popular
                            • Users
                            • Search