Streaming live at 10am (PST)

How to create Horizontal Drag/Scroll

Hello,
I would like to know if someone knows how to create this slider effect.

It is a horizontal scroll + an horizontal dragging.

Thanks in advance,

Hello.
Maybee this helps? - https://youtu.be/p-tTikEL4D8

Hey, @Josep_Pedro You can clone this draggable slider created by @timothy1643 add an ID to the left and right arrows, and the code to control them using the mouse wheel.

Code to hack the mouse wheel to control the slider arrow.
You can hide both arrows if you don’t want your users to see one.

<script>
  window.addEventListener("wheel", function (event) {
    if (event.deltaY < 0) {
      $("#ID of an left arrow").trigger("click");
    } else if (event.deltaY > 0) {
      $("#ID of an right arrow").trigger("click");
    }
  });
</script>

This is one way where you can achieve horizontal drag and scroll effect, Hope it helps :peace_symbol:

Hi Sachin,

I am using basic hosting plan so I don’t have CMS, how can I do it without it? I’ve watched Tim’s video and tried to create the same settings without CMS, it doesn’t really work.

I really appreciate if you can have a look at my website.

thank you!

Hey, @Daphne_wang In that case, you can use something like Glide.js as it has an inbuilt draggable functionality and it’s responsive. I haven’t tried it on any project yet but I’ve added it in my backlog and will get back with a cloneable.

Thank you so much! It works.