Draggable question/suggestion

[Esben Juul Mortensen]

Is it possible to define points in css strings?

 

My usecase is a mobile menu that slides out after a drag.

The value that the draggable item ends at is a pixel value which is fine until you resize the browser. I know you can't resize a phone but a rotate will have the same issue and you can of course also have menus like that on desktops.

 

A points definition of…

["0%", "100%"]

 …would fix that.

See the Pen BabddVY by tfl (@tfl) on CodePen

[Sahil]

You can simply set position of nav on resize. Also, you don't need to recreate draggable on each resize, you could update snap value like in example below or use function to calculate snap position. (Check docs to see how to use function to calculate snap value.)

See the Pen eYXGPOa by Sahil89 (@Sahil89) on CodePen

[Esben Juul Mortensen]

Thanks Sahil.

I know I can just set the position myself on resize, but I would just prefer not having to do that for both ease and performance.

But I didn't know that I could just update the snap value in the vars like that so thank you.