Jump to content

7.1 Button Hover Effect

Recommended Posts

Hi everyone,

I'm hoping to create a bit of interactivity on my client's site by adding hover animations to buttons and links. I would love to know the CSS to make the following animations:

  1. On hover, an arrow appears in a rightwards motion after the text eg. text ➔
  2.  The arrow transitions from after the text (eg. text ➔) to before the text on hover (eg. ➔ text). So it moves right, disappears, and appears from the left side coming in before the text.

I hope I'm making sense. Thanks in advance!

👋 Michelle John
Catchafire volunteer 
🖥️ Web & graphic design for churches, nonprofits & small businesses

🔗 brambledesign.co

Bramble Design

Link to comment
  • Replies 1
  • Views 521
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Create an account or sign in to comment

You need to be a member in order to leave a comment

  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.