Display (none/show) drag interactions on mobile (and desktop!)

Hello Webflow super community! :slight_smile:

What is the current state with click ´dragging´ mouse movement interactions in Webflow? (especially on mobile) ?

I would like to show/hide a div by dragging from left to right.

So at 50% (along the X-axis) instantly hide (display:none) the div.

Is this possible in Webflow? And on mobile?

I have the seen the ´mouse move´interactions, but there is no display:none option. And this appears to be for desktop only.

@PixelGeek @vincent @Waldo you are my heros over the last few years! :wink: Can one of you help?

Many thanks! !

Terry.

Hey @TerryHibbert,

You can look into this drag and drop website solution, but what you’re looking for is more of a side drag/slide I believe.

I haven’t seen anything native on Webflow that can do that, I’ll try to work on something like that!

Hi Carlos, thanks for the reply and the cool drag n drop effect website!

But yes, I´m looking for a mouse movement interaction that can work on movile, and using the hide/show display options.

@TerryHibbert I created this JS for swipe gesture on mobile.

https://webflow.com/website/Swipe-Gesture-JS?s=swipegesture

If you know some JS you may be able to execute actions on mobile. The idea with this may be that on desktop yo use one element and on mobile another one.

Hope this helps