Discussion
Loading...

Post

Log in
  • About
  • Code of conduct
  • Privacy
  • Users
  • Instances
  • About Bonfire
Mark Wyner Won’t Comply :vm:
Mark Wyner Won’t Comply :vm:
@markwyner@mas.to  ·  activity timestamp 4 weeks ago

Y’all. I made this cute little animation to show that a link was successfully copied. I use it on my writing site.

It’s not monumental, but I really like it. My son said it feels “very satisfying.”

#Design #CSS #Javascript #HTML #UI #Animation #InteractionDesign #WebDesign

Your browser does not support the video tag.
GIF
GIF
A link icon is visible near part of a date component. A mouse cursor hovers over the icon, then clicks it. The click triggers an animation that makes the icon shrink in size then get replaced with a green check mark in a circle that radiates outward one time. After 2 seconds, the icon animates back to its original state.
A link icon is visible near part of a date component. A mouse cursor hovers over the icon, then clicks it. The click triggers an animation that makes the icon shrink in size then get replaced with a green check mark in a circle that radiates outward one time. After 2 seconds, the icon animates back to its original state.
  • Copy link
  • Flag this post
  • Block
Paul Schoe
Paul Schoe
@paulschoe@mastodon.world replied  ·  activity timestamp 4 weeks ago

Love this visual confirmation that the copy of a link was successful.

@markwyner

  • Copy link
  • Flag this comment
  • Block
Mark Wyner Won’t Comply :vm:
Mark Wyner Won’t Comply :vm:
@markwyner@mas.to replied  ·  activity timestamp 4 weeks ago

@paulschoe thanks!

  • Copy link
  • Flag this comment
  • Block
kaiserkiwi :kiwibird:
kaiserkiwi :kiwibird:
@kaiserkiwi@corteximplant.com replied  ·  activity timestamp 4 weeks ago

@markwyner Looks like a good candidate for a link-copy web component.

  • Copy link
  • Flag this comment
  • Block
Mark Wyner Won’t Comply :vm:
Mark Wyner Won’t Comply :vm:
@markwyner@mas.to replied  ·  activity timestamp 4 weeks ago

@kaiserkiwi thank you.

  • Copy link
  • Flag this comment
  • Block
CM Harrington
CM Harrington
@octothorpe@mastodon.online replied  ·  activity timestamp 4 weeks ago

@markwyner nice!

  • Copy link
  • Flag this comment
  • Block
Mark Wyner Won’t Comply :vm:
Mark Wyner Won’t Comply :vm:
@markwyner@mas.to replied  ·  activity timestamp 4 weeks ago

@octothorpe thanks!

  • Copy link
  • Flag this comment
  • Block
Nazo
Nazo
@nazokiyoubinbou@urusai.social replied  ·  activity timestamp 4 weeks ago

@markwyner *In comes person with browser set to deny clipboard access to sites but their scripts think they're still doing it.* 😁

  • Copy link
  • Flag this comment
  • Block
Mark Wyner Won’t Comply :vm:
Mark Wyner Won’t Comply :vm:
@markwyner@mas.to replied  ·  activity timestamp 4 weeks ago

@nazokiyoubinbou yep. But the people who have intentionally blocked clipboard access know what to expect from these buttons.

If someone has taken that privacy step, they won’t click a copy-to-clipboard button. And if they do anyway, expecting…I don’t know *what* to happen, they simply get to see a cute animation.

  • Copy link
  • Flag this comment
  • Block
Nazo
Nazo
@nazokiyoubinbou@urusai.social replied  ·  activity timestamp 4 weeks ago

@markwyner Yes, but, I'm juking your script. Totally fooled.

...

It sounded funnier in my head.

  • Copy link
  • Flag this comment
  • Block

bonfire.cafe

A space for Bonfire maintainers and contributors to communicate

bonfire.cafe: About · Code of conduct · Privacy · Users · Instances
Bonfire social · 1.0.1-alpha.44 no JS en
Automatic federation enabled
Log in
  • Explore
  • About
  • Members
  • Code of Conduct