const target = useRef<HTMLDivElement>(null); const listenScrollEvent = (event) => { const toLeft = event.deltaY < 0 && target.current.scrollLeft > 0; const toRight = event.deltaY > 0 && target.current.scrollLeft < target.current.scrollWidth - target.current.clientWidth; if (toLeft || toRight) { event.preventDefault(); event.stopPropagation(); target.current.scrollLeft += event.deltaY; } }; return ( <div ref={target} onWheel={listenScrollEvent}>
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter