I want to have a container which scrolls in horizontal direction on mouse wheel scroll. For this purpose I need event.deltaY value, which I am not getting.
FYI - I am using page flow method to use js code method. But I cannot get event value in the value selector
I tried that method, but I could not scroll back to its original postion. So, you can scroll horizontally to right but can’t come back to left.
Sorry not sure I understand what you mean?
What I want to achieve is horizontal scrolling with mouse wheel rotation ? For this I need deltaY value from wheel event.
The method you mentioned works, but only to the right side scrolling. If you want scroll back to its original positon, you can’t scroll. The value is stuck there.
Please keep in mind that the wheel event is applied to a overflowing flex container. So I want scroll event inside that container only.
Maybe I just don’t get your idea. So you are saying the scroll up doesn’t return the proper Y position?
const scrollContainer = document.querySelector("main");
scrollContainer.addEventListener("wheel", (evt) => {
evt.preventDefault();
scrollContainer.scrollLeft += evt.deltaY;
});
This is a normal js code which works fine.
The below image are from my wappler project. For horizontal_scrolling
Dynamic wheel event of flex container == Using your described method.
Page flow to run js code
JS code to update scroll location
This has been added in Wappler 4.8.3
This topic was automatically closed after 2 days. New replies are no longer allowed.
