horizontal scroll with Draggable

[onopko81]

How use gsap draggable with lenis horizontal scroll?
alternative?

thanks

[onopko81]

I solved it with a custom solution, anyone who has had the same problem as me contact me

[michaelevine]

Hi @onopko81, I was wondering how you solved it?

[onopko81]

hi @michaelevine, this solution is for nextjs

const [down, setDown] = useState({status: false, position: 0})
const lenis = useLenis(({scroll}) => {
ScrollTrigger.update()
})
// if (lenis && lenis.scrollTo) lenis.scrollTo(1000)

const onMouseDown = useCallback((e) => {
    setDown({status: true, position: e.pageX})
},[])

const onMouseLeave = useCallback((e) => {
    setDown({status: false})
},[])

const onMouseMove =  useCallback((e) =>{
    if(lenis && lenis.scrollTo && down.status === true ) {
        const p = down.position - e.pageX
        lenis.scrollTo(lenis.scroll + p)
    }
},[down])

apply this callback to main container:
onMouseUp={onMouseLeave} onMouseLeave={onMouseLeave} onMouseMove={onMouseMove} onMouseDown={onMouseDown }