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. Addons
  3. Fullscreen slider: slide only to the right + click on image doesn't work

Fullscreen slider: slide only to the right + click on image doesn't work

Scheduled Pinned Locked Moved Addons
24 Posts 2 Posters 661 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.
  • arminunruhA Online
    arminunruhA Online
    arminunruh
    Global Moderator
    wrote on last edited by
    #2

    the content (a longer text) overflows the browser height. I tried the he "Give elements a max-width and max-height and center them" option, didn't change anything.

    this setting doesnt work for text

    only for images and such

    when clicking on an image or a video the navigation (so to slide to the next row) doesn't work. how can this be fixed? It seems only to work with text?

    i think it only doesnt work with videos, with images it works for me, can u confirm?

    Screenshot 2024-03-14 at 20.29.45.png

    when i click on this image it still works

    try this css:
    Enter the custom css in "lay options" -> "custom css & html".

    .col.type-html5video{
    pointer-events:none;
    }
    

    for the other points i guess its a no, because there is no setting for that

    1 Reply Last reply
    0
    • D Offline
      D Offline
      danny
      wrote on last edited by
      #3

      thanks @arminunruh ;)

      jes, clicking on images works.
      the css works as well, no I can click on the videos.

      This was still open:
      Is it possible to only move to the right in general?

      And for the text: what would you suggest?

      In the end I would like to archive a website, that is slide by slide after each other, only clickable in one direction, so sth like this one: https://www.lutzbacher.com/

      thanks for your help!
      Daniel

      1 Reply Last reply
      0
      • D Offline
        D Offline
        danny
        wrote on last edited by
        #4

        hi @arminunruh - did you had time for this? thanks

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

          hi @arminunruh - did you had time for this? thanks

          no i was on an airplane the whole day and i had some other tasks to do

          Is it possible to only move to the right in general?

          no its not possible as i said :/

          Screenshot 2024-03-18 at 14.31.03.png

          the content (a longer text) overflows the browser height. I tried the he "Give elements a max-width and max-height and center them" option, didn't change anything.

          can u right click on the text? then try to set widths that are appropriate for desktop, tablet, phone

          Screenshot 2024-03-18 at 14.32.11.png

          you could also try to use shorter texts
          you could also try to use a smaller fontsize

          probably since click only works for previous and next instead of using no cursor it could be wise to use a mousecursor in lay options → fullscreen slider addon

          1 Reply Last reply
          0
          • D Offline
            D Offline
            danny
            wrote on last edited by
            #6

            thanks @arminunruh

            unfortunately it doesn't work with the text page. would it be possible to use custom CSS to have a scroll button on the text page? everything else with the fulllscreen slider works perfect so it would be a shame not to use it.

            (i tried with the carousel addon, then the text is cut.)

            my goal is a website like https://www.lutzbacher.com/

            thanks again

            1 Reply Last reply
            0
            • D Offline
              D Offline
              danny
              wrote on last edited by
              #7

              hi @arminunruh - did you had time for this? thanks a lot

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

                sorry for the late answer

                Enter the custom css in "lay options" -> "custom css & html"

                in custom css:

                .fp-slidesContainer{
                overflow-y: scroll;
                -webkit-overflow-scrolling: touch;
                }
                

                and in custom <head> content:

                <script>
                jQuery(window).on('fpAfterSlideLoad', function(){
                // everytime we go to the next slide, scroll to top again
                jQuery('.fp-slidesContainer').scrollTop(0);
                });
                </script>
                
                1 Reply Last reply
                0
                • D Offline
                  D Offline
                  danny
                  wrote on last edited by
                  #9

                  thanks @arminunruh ! that works great. is it possible that the scroll button is only activated on the pages where the content overflows the browser height? now we have a scroll button on every page i.e. on pages where it is not needed.

                  and for mobile: it does not seem to apply here? would I need another code? (I copy+pasted the code into Custom CSS for Mobile Version, that does not work)

                  thanks!

                  1 Reply Last reply
                  0
                  • D Offline
                    D Offline
                    danny
                    wrote on last edited by
                    #10

                    hi @arminunruh - sorry, did you had time for this? thanks :)

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

                      can u delete all of the code, now use this instead:

                      custom css:

                      .fp-tableCell .row-inner{
                          height: 100svh;
                          max-height: 100svh;
                          overflow-y: scroll;
                          -webkit-overflow-scrolling: touch;
                      }
                      

                      custom <head> content:

                      <script>
                      jQuery(window).on('fpAfterSlideLoad', function(){
                          // everytime we go to the next slide, scroll to top again
                          jQuery('.fp-tableCell .row-inner').scrollTop(0);
                      });
                      </script>
                      

                      sorry man pls be a little patient with my response times at the moment

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

                        oh and remove your password protection if you have more questions so i can look at it on ur site

                        1 Reply Last reply
                        0
                        • D Offline
                          D Offline
                          danny
                          wrote on last edited by
                          #13

                          thanks so much, that works!! (password protection is removed).

                          1 Reply Last reply
                          1
                          • D Offline
                            D Offline
                            danny
                            wrote on last edited by
                            #14

                            Hi @arminunruh,

                            using the fullscreen slider it seems the fullscreen is not applying. Either if I have only one video or two videos in one row the fullscreen doesn't work. Might this because of the custom CSS? I tried to use "Use Browser Height for Row Height" that doesn't work and makes no sense anyways I believe.

                            It doesn't work for portrait and horizontal videos.

                            https://tiranwillemse.com/fullscreen1/

                            Thanks!

                            1 Reply Last reply
                            0
                            • D Offline
                              D Offline
                              danny
                              wrote on last edited by
                              #15

                              The Custom CSS has two x so I guess it is not applying. I tried using !important which didn't change anything.

                              Bildschirmfoto 2024-05-07 um 16.59.10.png

                              1 Reply Last reply
                              0
                              • D Offline
                                D Offline
                                danny
                                wrote on last edited by
                                #16

                                Bildschirmfoto 2024-05-07 um 17.27.33.png

                                Bildschirmfoto 2024-05-07 um 17.27.39.png

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

                                  The Custom CSS has two x so I guess it is not applying.

                                  no, the editor just doesn't know svh so it thinks its wrong css

                                  Either if I have only one video or two videos in one row the fullscreen doesn't work

                                  Screenshot 2024-05-08 at 16.05.53.png

                                  here is one slide with two videos.

                                  i dont understand what u mean

                                  Either if I have only one video or two videos in one row the fullscreen doesn't work.

                                  we have a fullscreen slider where u can scroll up and down in the content

                                  what u mean is the video is not 100% height of the browser right?
                                  yea, any elements are width based. so their size depends on how many columns in the gridder they use.

                                  if you want one element to be 100% height of the browser and use fullscreen slider, u can use this setting in lay options → fullscreen slider:

                                  Screenshot 2024-05-08 at 16.08.13.png

                                  it only works if there is one video in a row

                                  1 Reply Last reply
                                  0
                                  • D Offline
                                    D Offline
                                    danny
                                    wrote on last edited by
                                    #18

                                    thanks. yes that's what I meant. the thing is when use the setting you suggest it affects of course every slide. which I don't want to have.

                                    remember: this fullscreen slider consists of pages that are to scroll because the content is longer then the view height (like a long text).

                                    that's why you send me the code earlier on.

                                    so I guess it is not possible to have SINGLE SLIDES (with one image or video) in the fullscreen slider that are 100% height of the browser?

                                    thanks!

                                    1 Reply Last reply
                                    0
                                    • D Offline
                                      D Offline
                                      danny
                                      wrote on last edited by
                                      #19

                                      hi @arminunruh did you maybe had time for this?

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

                                        hey i think theres no way to do this! the sizes of the elements are based on their set width

                                        1 Reply Last reply
                                        0
                                        • D Offline
                                          D Offline
                                          danny
                                          wrote on last edited by
                                          #21

                                          hey even if it's only one image or one video?

                                          would there by a custom CSS for this?

                                          thanks!

                                          1 Reply Last reply
                                          0
                                          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
                                          arminunruhA
                                          arminunruh
                                          F
                                          francesco
                                          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