Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • August 28, 2019 at 12:27 pm #1131579
    Clydeo

    Hi

    I am trying use CSS Scroll Snapping on our home page with Enfold. I want fixed scrolling to snap to the start of the next color section.

    I have used this:

    /* Scroll Snapping */

    #wrap_all {
    scroll-snap-type: y mandatory;
    }

    .snapScroll {
    scroll-snap-align: start;
    }

    However it is not working. I have also tried to use “scroll-snap-type: y mandatory;” on the #main, body and html elements but neither work.

    Any ideas?

    I have included our test site address below.

    Thank you

    • This topic was modified 5 years, 2 months ago by Clydeo.
    August 30, 2019 at 6:36 am #1132165
    Mike

    Hey Clyde,
    Sorry for the late reply, I researched the “scroll-snap-type” and found a good article on CSS Tricks but testing Chrome and Firefox with their CodePen examples I found that it was not working without the javascript code that is found in a later example, yet it didn’t work very well as I had to take care to not over scroll, but also scroll within about 20px of the top of the section.
    The article says that it is supported in Chrome v69 but I’m using v76.0.3809.100, perhaps this is a browser issue?

    In further research I found to “avoid using scroll-snap-type which is also present in the deprecated specification and can be unreliable.”

    I tried testing many examples on different sites to find one that would work, but the only one I found was this javascript example.

    I hope this helps.

    Best regards,
    Mike

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