本文通過(guò)原生JS，點(diǎn)擊事件，鼠標(biāo)按下、鼠標(biāo)抬起和鼠標(biāo)移動(dòng)事件，實(shí)現(xiàn)3D立方體的拖動(dòng)旋轉(zhuǎn)，并將旋轉(zhuǎn)角度實(shí)時(shí)的反應(yīng)至界面上顯示。
實(shí)現(xiàn)原理：通過(guò)獲取鼠標(biāo)點(diǎn)擊屏幕時(shí)的坐標(biāo)和鼠標(biāo)移動(dòng)時(shí)的坐標(biāo)，來(lái)獲得鼠標(biāo)在X軸、Y軸移動(dòng)的距離，將距離實(shí)時(shí)賦值給transform屬性。
從而通過(guò)改變transform：rotate屬性值來(lái)達(dá)到3D立方體旋轉(zhuǎn)的效果：
HTML代碼塊：
新聞熱點(diǎn)
疑難解答
圖片精選
