Loading video...
Video Failed to Load
iOS-style morphing context menu w/ css transitions 👨🍳 [popover] api + anchor positioning + transition-behavior: allow-discrete
31,121 views • 9 months ago •via X (Twitter)
15 Comments

seen other versions of this floating around but they missed the mark for me in terms of UX 👎 non-semantic markup, ignoring user prefs, no smart placement you don't need libs for any of that stuff, you can jus' build it yourself and wrap it up in a web component ✅

the directional curve on this is very nice 👌

Now this ur really cool

@a6xx9rq thanks 🙏 had to scratch the itch

You cooked 🔥🐐

Hi, do you have a website or codepen where you share the source code for your components?

Beautiful

thanks Kyle 🤙

which chrome tool is that? to preview animation in slow mode?

animating width and height or just scale? I always struggle with that and end up with some jank

Another day to learn from you!

Nice implementation . But have to say I am not the biggest fan of this version 😅

you mean the iOS style? i pretty much copied it from a screen recording and reduced the alpha + border-radius

Yeah I mean the ios style. I don’t know but just to much bouncing for my taste 😅. But yeah respect for making this with css

oh yeah, i hear that 😅 i jus' been screen capturing things from my phone and messin' with them. i tried to pull it back a little, this one's from the Photos app and that has some significant bounce!
