開場我就先說，純 CSS 無法做到，因為 CSS 無法由子元素的 hover（游標碰觸）來變更父元素的樣式，所以就要用到萬能的 JavaScript！運用 DOM 的控制來做到 CSS 目前做不到的事情！這次主題為「游標碰觸子元素使父元素樣式變更」。 需要用到的 JavaScript 事件有兩個：mouseover 與 mouseout，前者代表游標碰觸到元素，後者代表游標沒有碰觸到元素。

JavaScript 有個內建的事件 可用來獲得裝置陀螺儀的動向/方向資訊，結合 CSS 的 就可以做到翻轉裝置使圖片三維翻轉的效果！當然這只是測試時好玩做出來的效果，實際上若結合指北、指南等，將可以做到更多應用！這邊簡單列出會用到的三個方向值： 值為裝置水平放置時的 Z 軸動向，介於 0 ~ 360 度之間，可以想像裝置放在桌面上轉動（？）。 值為裝置水平放置時的 X 軸動向，介於 -180 ~…