從效果中不難看出，是使用陀螺儀事件實現的。
這裡先來看一下html5中陀螺儀事件的一些概念。
陀螺儀事件為deviceorientation，這裡主要獲取事件中的alpha,beta,gamma。
移動裝置水平放置時，繞 z 軸旋轉的角度，數值為 0 度到 360 度。
移動裝置水平放置時，繞 x 軸旋轉的角度，數值為 -180 度到 180 度。
移動裝置水平放置時，繞 y 軸旋轉的角度，數值為 -90 度到 90 度。
這裡，只需要用到beta和gamma。
將apk解壓，得到眼睛素材：
/** author: 王樂平
部落格名稱：王樂平部落格本作品採用
知識共享署名-非商業性使用-禁止演繹 4.0 國際許可協議進行許可。
html5的陀螺儀
獲取移動裝置的陀螺儀，需要知道陀螺儀包含什麼。我們可以讓document監聽deviceorientation 來獲取相關的資料，裡面包括3個值 alpha beta和gamma。這三個值分別代表 1 alpha 移動裝置水平放置時，繞z軸旋轉的角度，數值為0度到360度。移動裝置水平放置時，繞x軸...
HTML5實現拖放
拖放 drag 和 drop 是 html5 標準的組成部分。拖放是一種常見的特性，即抓取物件以後拖到另乙個位置。在 html5 中，拖放是標準的一部分，任何元素都能夠拖放。internet explorer 9 firefox opera 12 chrome 以及 safari 5 支援拖放。注釋...
2 基於html5的模板
2.基於html5的模板 html5的模板包括doctype,html元素，head元素 1.doctype 是我們進行文件型別宣告，讓用來告訴瀏覽器 或任何分析程式 他們所檢視的檔案型別。在過去的doctype宣告非常難看且難記 熟悉html的人對這些 在熟悉不過了。但是在html5中將上述 精簡...