CodePen Embed - CSS Animation Example 2

<a id="bouncy-link" class="bouncy" href="#">Bouncy link</a>

.bouncy {
  display:block;
  position:absolute;
  top:50vh;
  left:45vw;
  text-decoration:none;
  transition:margin-top 0.3s;
}
.bouncy-hover{
  margin-top:-20px;
}

var bouncyLink = document.getElementById("bouncy-link");

bouncyLink.addEventListener("click",function(e){
  e.preventDefault();
  bouncyLink.classList.toggle("bouncy-hover");  
})

This Pen is owned by Ion Emil Negoita on CodePen.

See more by @inegoita on CodePen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.