img shake on hover

Tags: shake, hover, img, request

Description:

i dont remember where i got this but someone asked me to post it

Code:

<!-- (c) Layout created by BOW / BIVE ✦ (https://layouts.spacehey.com/layout?id=40624) -->

img:hover {
  animation: shake 0.5s;

  animation-iteration-count: infinite;
}

@keyframes shake {
  0% { transform: translate(1px, 1px) rotate(0deg); }
  10% { transform: translate(-1px, -2px) rotate(-1deg); }
  20% { transform: translate(-3px, 0px) rotate(1deg); }
  30% { transform: translate(3px, 2px) rotate(0deg); }
  40% { transform: translate(1px, -1px) rotate(1deg); }
  50% { transform: translate(-1px, 2px) rotate(-1deg); }
  60% { transform: translate(-3px, 1px) rotate(0deg); }
  70% { transform: translate(3px, 1px) rotate(-1deg); }
  80% { transform: translate(-1px, -1px) rotate(1deg); }
  90% { transform: translate(1px, 2px) rotate(0deg); }
  100% { transform: translate(1px, -2px) rotate(-1deg); }
}

Copy and paste this code into the "About me" section of your Profile to use it.

Caution: This Layout was not inspected by SpaceHey — use it at your own risk.

Comments

Displaying 5 of 5 comments ( View all | Add Comment )

𓆩YmiR𓆪	1741535996 using tyy Report Comment
☆ 𝚂𝚢𝚕𝚟𝚎𝚜𝚝𝚎𝚛 ☆ 🏳️‍⚧️🏳️‍🌈	1738553590 using! Report Comment
wrenisonfire	1730686926 usuing Report Comment
MasterShakeYuri2010 [autoplay!]	1726676412 thank you so much! using Report Comment
: luna !? ੈ✩‧₊˚	1694319816 OMG DO U HAVE THE ONE THAT TURNS RAINBOW WHEN YOU HOVER?? IVE BEEN LOOKING FOR IR FOR MONTHS Report Comment @keyframes hoverrainbow{ from{ filter:saturate(300%) hue-rotate(0deg); } to{ filter:saturate(300%) hue-rotate(360deg); } } main img:hover { filter:saturate(300%); animation: 1s hoverrainbow infinite linear; } !!! by seal talkingheads by BOW / BIVE ✦; 1694327609; Report TYSM OMGG by : luna !? ੈ✩‧₊˚; 1694393356; Report TYSM OMGG by : luna !? ੈ✩‧₊˚; 1694393356; Report OMG THIS IS THE AWESOMEST THING IN THE WORLD I'VE EVER SEEN TYSM !!!!!! by 🎧 Serafina 🎧; 1717974988; Report