Effortlessly Animating a Drag & Drop Kanban Board With View Transitions

แชร์
ฝัง
  • เผยแพร่เมื่อ 24 ธ.ค. 2024

ความคิดเห็น • 27

  • @frontendfyi
    @frontendfyi  ปีที่แล้ว

    Don’t forget to grab a pro membership while it’s still €99 euro! Learn more on www.frontend.fyi/pro.

  • @vidigitusmarketing862
    @vidigitusmarketing862 9 หลายเดือนก่อน

    Greate video! The view transition API is just amazing 👌

  • @evgeniilevenkov6200
    @evgeniilevenkov6200 11 หลายเดือนก่อน

    Thanks for such great content!

    • @frontendfyi
      @frontendfyi  11 หลายเดือนก่อน +1

      Thank you! And thank you so much for the super thanks, really appreciate it!

  • @empoweracademy2276
    @empoweracademy2276 6 หลายเดือนก่อน

    Does it work on mobile touch?

  • @josephgabriel8003
    @josephgabriel8003 8 หลายเดือนก่อน

    where can I get the starter code?

  • @AntoniKiddcodePutra
    @AntoniKiddcodePutra 9 หลายเดือนก่อน

    Great Tutorial thanks so much for Sharing..
    Btw, what is your browser?

    • @frontendfyi
      @frontendfyi  9 หลายเดือนก่อน

      It's called Arc:
      arc.net/gift/7611d3fc

  • @eduardosantos3516
    @eduardosantos3516 ปีที่แล้ว

    I'm watching your framer motion videos but I have a problem, I need to use usescroll because the offset property doesn't exist anymore. how could i get around this problem?

    • @frontendfyi
      @frontendfyi  ปีที่แล้ว

      Check my reply to your other comment.

  • @arman3400
    @arman3400 ปีที่แล้ว

    Asking respectfully. Since view transitions is not supported on mobile, that leaves out like 90% of clients. Is it possible to ensure desktop (non-firefox/safari) users get view transitions, and everybody else gets framer-motion?

    • @frontendfyi
      @frontendfyi  ปีที่แล้ว +1

      Doing Framer Motion as a fallback is a bit harder - or at least it would add quite a bit of extra code. Plus you're building the animation twice.
      I think it's more interesting to look at for example the polyfill Bramus is working on: twitter.com/JeroenReumkens/status/1696261766312050983?s=20
      And for browsers that are then still not supported, consider it as graceful degradation, and just don't give them any animations?

    • @arman3400
      @arman3400 ปีที่แล้ว

      @@frontendfyi I appreciate the share, looks cool but I don’t think it’s what I’m looking for (smooth/tightly controlled transitions between routes in an MPA), so I think it might be better to just make it in Next and Framer. Thanks for the reply.

    • @frontendfyi
      @frontendfyi  ปีที่แล้ว +1

      I think framer is indeed the right way to go with now yeah!

  • @sinasalahshour
    @sinasalahshour 10 หลายเดือนก่อน

    i think it has a bug. when you drag and drop the item on top(or bottom) of itself, it duplicates

  • @frontendfyi
    @frontendfyi  ปีที่แล้ว

    Wow, Adam Argyle just shared a tweet where he shows it actually IS possible to get drag and drop functionality on iOS! I just updated the article and code snippets to reflect this. See here: twitter.com/JeroenReumkens/status/1687342337737846784?s=20

  • @krushilnaik126
    @krushilnaik126 ปีที่แล้ว

    What theme is that 👀

    • @frontendfyi
      @frontendfyi  ปีที่แล้ว +2

      It’s the Bearded Theme (Arc) in vscode!

  • @braswelljr
    @braswelljr ปีที่แล้ว

    You are good bro

  • @WanderingBall
    @WanderingBall ปีที่แล้ว

    you are amazing

  • @serychristianrenaud
    @serychristianrenaud ปีที่แล้ว

    Thank great video 🎉🎉🎉

  • @davidbrumsoares
    @davidbrumsoares 5 หลายเดือนก่อน

    Unfortunately, this doesn't work on mobile

  • @sahilverma_dev
    @sahilverma_dev ปีที่แล้ว

    great

  • @draftermyself
    @draftermyself ปีที่แล้ว

    😮

  • @alaminmir08
    @alaminmir08 ปีที่แล้ว

    Hey Man. I just love what are you doing. Just some small requests: be more consistent, create bigger projects And don't get lost.

  • @abdallahmoubarak5303
    @abdallahmoubarak5303 6 หลายเดือนก่อน

    Does it work on mobile touch?