Skip to content

Instantly share code, notes, and snippets.

@carolina-vallejo

carolina-vallejo/svg-button-animation.css

Created December 30, 2017 07:42
Show Gist options
  • Save carolina-vallejo/32d3e77cff548ae9e3bae5ec3852bd03 to your computer and use it in GitHub Desktop.
Save carolina-vallejo/32d3e77cff548ae9e3bae5ec3852bd03 to your computer and use it in GitHub Desktop.
Download ZIP
#css svg button animation
Raw
svg-button-animation.css
.boton-mas svg {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.boton-mas svg rect {
stroke-width: 1;
stroke-dasharray: 353, 0;
stroke-dashoffset: 0;
transition: all 600ms ease;
}
.boton-mas:hover svg rect {
stroke-dasharray: 98, 543;
stroke-dashoffset: 437;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment