I make a button with a jerking effect, as on the site . I copied the animation code for the button, but the button does not work.

How can I create the same button?

  • It will always be like this if you copy the code. See css3 animation / keyframes. - etki
  • one
    @Etki, a controversial issue, copying a beautiful effect and customizing it for yourself is quite a normal practice, but in any case, figuring out how it works is necessary - MasterAlex

1 answer 1

And keyframes copied?

Here, from the site of the example, they

<style type="text/css"> @-moz-keyframes cycle { 35% {transform: rotate(0) translate(0, 0);} 40% {transform: rotate(5deg) translate(0, -2px);} 45% {transform: rotate(-3deg) translate(0, -2px);} 50% {transform: rotate(5deg) translate(0, -2px);} 55% {transform: rotate(-3deg) translate(0, -2px);} 60% {transform: rotate(5deg) translate(0, -2px);} 65% {transform: rotate(-3deg) translate(0, -2px);} 70% {transform: rotate(0) translate(0, 0);} } @-webkit-keyframes cycle { 35% {transform: rotate(0) translate(0, 0);} 40% {transform: rotate(5deg) translate(0, -2px);} 45% {transform: rotate(-3deg) translate(0, -2px);} 50% {transform: rotate(5deg) translate(0, -2px);} 55% {transform: rotate(-3deg) translate(0, -2px);} 60% {transform: rotate(5deg) translate(0, -2px);} 65% {transform: rotate(-3deg) translate(0, -2px);} 70% {transform: rotate(0) translate(0, 0);} } </style>
  • What about just @keyframes? - MasterAlex
  • I wrote that I copied from that site. Next, I think you can google and finish as you need already. =) - Crus
  • Cool! Thank. - Frontender