（1）全部圖片抖動

img:hover{animation: tada 1s .2s ease both;-moz-animation: tada 1s .2s ease both; }@keyframes tada{ 0%{-webkit-transform:scale(1);}10%, 20%{-webkit-transform:scale(0.9) rotate(-3deg);}30%, 50%, 70%, 90%{-webkit-transform:scale(1.1) rotate(3deg);}40%, 60%, 80%{-webkit-transform:scale(1.1) rotate(-3deg);}100%{-webkit-transform:scale(1) rotate(0);}}

（2）部分圖片抖動
這邊有的人和我說不喜歡全站的圖片都這樣抖動，只希望部分的就可以。 那么我給出一個方案，給需要抖動的img前面加個div 給div加class屬性=dimg 然后css代碼如下：

.dimg img:hover{animation: tada 1s .2s ease both;-moz-animation: tada 1s .2s ease both; }@keyframes tada{ 0%{-webkit-transform:scale(1);}10%, 20%{-webkit-transform:scale(0.9) rotate(-3deg);}30%, 50%, 70%, 90%{-webkit-transform:scale(1.1) rotate(3deg);}40%, 60%, 80%{-webkit-transform:scale(1.1) rotate(-3deg);}100%{-webkit-transform:scale(1) rotate(0);}}

總結

以上是生活随笔為你收集整理的鼠标经过图片抖动效果的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。