這篇文章主要介紹了html5實現圖片轉圈的動畫效果－讓頁面動起來的相關資料,需要的朋友可以參考下
1.先瞧瞧效果：
2.程式碼是這樣的：
@mixin ani-btnRotate{ @keyframes btnRotate{ from{transform: rotateZ(0);} to{transform: rotateZ(360deg);} } } @include ani-btnRotate; #circle{ position: absolute; left: 50%; width: REM(338); height: REM(338); margin-top: REM(200); margin-left: REM(-338/2); transform-origin: center center ; animation: btnRotate 1s 1s linear forwards; }
登入後複製
用到的圖片是這個：（就是白色轉動的那張圖片）
#以上就是本文的全部內容，希望對大家的學習有所幫助，更多相關內容請關注PHP中文網！
相關推薦：
如何使用jQuery和HTML5實現手機搖晃的換衣特效
如何利用canvas實現按住滑鼠移動繪製出軌跡
用HTML5 Canvas來繪製三角形和矩形等多邊形的方法
#
以上是html5如何實現圖片轉圈的動畫效果的詳細內容。更多資訊請關注PHP中文網其他相關文章！
