Streaming live at 10am (PST)

Slick Slider is breaking mobile site

Hello,

I’ve been reading all the slick slider post on the forum and I think this is a new one :slight_smile:

I use slick slider (followed all the instructions here) for text filled slides. I want to show 1 slide at a time.
I works fine on the desktop version but

  • the slider looks strange on mobile
  • and it seems to mess with webflow interactions. For instance: I have a ‘scroll into view’ interaction on the same page, above the slider. (so OUTSIDE of de slider) But these items don’t show properly on page load when on mobile. You just don’t see them. As soon as I hide the section with the slider on mobile, everything else works just fine.

Anybody else have experienced this?

I’ll tag some people who have been writing about the slick slider, hope that is okay:
@webdev
@Siton_Systems
@Noah-R
@jbleroux

Here is my public share link: https://preview.webflow.com/preview/heidihessing?utm_medium=preview_link&utm_source=designer&utm_content=heidihessing&preview=9d653aa1d51c25d553132e40f3c699f3&mode=preview
(how to access public share link)

Here is the published link:
https://heidihessing.webflow.io/

Hi. Do these tests:

  • test1: Move the slider to a “new” testing page and test on mobile (Working or not?)
    No working? go to …
  • test2: Remove interactions
    Not working…
  • test3: Remove all of your custom styles (From the slider)
    I guess there is a bug related to test3 (You added a lot of extra styles)

Your main page looks “broken” on chrome inspector (mobile) - so maybe the issue not related to slick:
Open the Chrome developer tools (F12), and then click the “Toggle the Device Toolbar” button (Ctrl+Shift+M).

Inner pages looks fine:

Hai,

I sorry for the late response and thank you for your help!
Test 1 and 2 I already did. But cleaning up the custom styling of the slider and the slides did the trick. Somehow this also fixed the broken interactions on the other parts of the page.

Never expected that, but great it worked :). Apparently when you do a lot of manual styling within the slick slider is messes up, not only the slider functionality on mobile, but also other webflow interactions??