Move Over Hyperlinks

unnamed.gif

Description

Add a move over effect to any hyperlinks. This plugin uses css editor and works with all template families.


How To Install

From your Squarespace account, go to the Custom CSS Editor. Copy and paste the code below into the Custom CSS Editor box.

// Move Over Hyperlinks //

p a {
  -webkit-transition: ease-in-out 0.5s !important;
  -moz-transition: ease-in-out 0.5s !important;
  -ms-transition: ease-in-out 0.5s !important;
  -o-transition: ease-in-out 0.5s !important;
  transition: ease-in-out 0.5s !important;
}

p a:hover {
  margin-left: 20px;
  -webkit-transition: ease-in-out 0.5s !important;
  -moz-transition: ease-in-out 0.5s !important;
  -ms-transition: ease-in-out 0.5s !important;
  -o-transition: ease-in-out 0.5s !important;
  transition: ease-in-out 0.5s !important;
}

Customize

Change the p text property to the one you’d like to target. This can be either h1, h2, h3 or h4. Do not delete the a after the text property – this tells CSS that it is to target hyperlinks.

Adjust the the margin-left value to adjust how much you want the hyperlinks to move over.


Previous
Previous

Move Over Button

Next
Next

Pressed Down Image Card Block Button