I am trying to achieve this effect that imitates a slider move on a mouse scroll.
I looked through Webflow forum, but seems like this thing doesn’t work properly Trigger slides with mouse scroll? since the slide is stuck after the first move. it works randomly, sometimes it moves, sometime no.
then the other thread with a solution from Diarmuid_Sexton with his cloneable website http://horizontal-scroll-full.webflow.io and a custom code, but seems like it is working on his website, but after cloning and publishing the website. it doesn’t work…
do you have any idea how I could achieve this effect?
hi, thanks for the answer.
you probably scrolled it once? in this case, yes it works. but after the slide is moved, then nothing happens, when you try to scroll again
I went back and forth and back and forth and back and forth, I used edge.
Yes only the live website works, you have to publish the webflow one as its using scripts which dont work in preview.
no, of course I did it over the image. still does’t work. it causes some other strange behavior. if I hover out of the image and then hover back to the image, it pushes the slide itself without even scrolling it. I don’t think this options works for me would appreciate other options.
If that published website doesn’t work on your system then I would work out why else any solution isn’t going to work.
Did you have the link to the other cloneable site as I couldn’t find it.
That’s my point, you need to know why your system is stopping that.
Do you have browser extensions or script blockers enabled?
Try a new vanilla browser.
Plus I was referring to the cloneable site if there is one to this link http://horizontal-scroll-full.webflow.io
Horizontal scrolling isn’t something I have experience with as its not something I like visually. I might take a quick peek around to see if I can find something.
Adam, sorry dude but I need a link to the guys cloneable website not the published one.
I see your website and yes it scrolls up not horizontal so lets see if I get the source you copied its the same for me.
You got me curious now.
There is another one, which I am not sure which function it performs since it doesn’t work even on his website. You should probably disregard this one and focus just on the first one we were talking about:
Horizontal Scroll-Partial
Here’s the jInvertScroll sample site - you can see that when you scroll on this site, it scrolls by how much you’ve turned the scroll-wheel/trackpad
Cheers, I noticed it stopped working 2 years ago from the comments.
Right, it uses a javascript plugin which you need to find and insert.
I think its this User-friendly Scrollbar For Scrollable Content - horizontal.scroll.js | Free jQuery Plugins (jqueryscript.net)
If you read his notes he says this
This is sample site which uses the horizontalScroll.js plugin to give a horizontal scrolling effect. You can see that when you scroll on this site, it scrolls one full page/section.
I am looking at something that references this website and see what they have to say.
Ok that isn’t the code he used that one adds a scroll bar.
So I have found a pixelgeek video that talks about that site and tried to so the same without any code.
He does it from a blank page so see if you like his idea and build it at the same time. https://www.youtube.com/watch?v=05frGyjyZvE
I am currently using this solution but it doesn’t snap the picture as was on the example we discussed earlier. In other words you can stop a slide on the stack between two pictures in the middle of the screen. While that original solution snapped each picture to the side of the scree with one scroll so you would never see this stack between them. I am really not sure why Webflow makes it is so problematic to achieve this… So many users outside of Webflow have this horizontal slide scroll… It’s a common site model.
That could be so easily done in a slider settings. You enable one option and the slide can be scrolled with a mouse. You enable another option - and the slider snaps to the screen instead of stacking…
would appreciate other options.