1. 首先我們定義乙個div，可以給乙個id，比如pointer
2. 把它設定成圓形並填充，這裡我就用畫圖做了乙個簡單的箭頭，用作指示。
height:100px;
width:100px;
border-radius: 50%; //圓角設成一半，就變成圓形了
display:inline-block;
background:url("img/pointer.jpg"); //用背景來代替img標記
3. 再新增animation屬性，設定動畫的一些屬性，再由@keyframes來實現動畫效果
#pointer
@keyframes rotate
100%
這樣，開啟網頁，整個圓盤就開始旋轉了。再實現點選暫停的功能，這裡用到了jquery的toggleclass方法，並設定乙個暫停的屬性。
.pause
$(document).ready(function());
});這時候，點選圓盤就暫停，再點選就繼續。
css3實現圓形逐漸減少動畫
寫這個動畫剛開始完全沒有思路，後來參考網上的資料發現可以用半圓實現，具體原理如下 1.乙個div作為背景，三個div做出三個半圓出來，乙個用於旋轉，乙個靠左 用於與背景吻合 乙個靠右 用於與背景吻合 2.做出另一組div更換背景色即可實現反方向的旋轉。如下 doctype html html hea...
CSS3 實現元素翻轉（不是旋轉）
有時候我們要實現元素的垂直或者水平翻轉，尤其是的翻轉，兩張對稱的，可以用兩張來解決這個問題，那麼其他的元素呢？而且存兩張並不是上上策，如何用 實現呢？css3提供了transform屬性，實現方法如下 水平翻 transform scale 1,1 垂直翻 transform scale 1,1 那...
css3實現旋轉的立方體
利用css3實現旋轉的立方體 這裡主要用到了css3的transform，rotate，translate，animation 首先給ul設定transform rotatex 30deg rotatey 55deg 使物體看起來有立體感 然後給六個li，給li設成絕對定位，使六個li重疊到一起 先...