做一個機械鐘表,鐘表背景,做一個三指針偏轉的動畫效果
1、獲取當地時間
獲取三個指針的對象(樣式不贅述)
var h = document.getElementById("h"); var m = document.getElementById("m"); var s = document.getElementById("s");
獲取當地時間
function setTime(){ var date = new Date();
1)
//思路:設置秒針旋轉角度;60 = 360deg; 1 = 6deg; var seceonds = date.getSeconds();//獲取當前秒數 s.style.transform=" rotate("+6*senconds+"deg)"; //(style中的樣式transform =rotate(x deg))旋轉多少度; // 60分鐘 = 360deg 1分鐘=6deg; var minutes = date.getMinutes(); m.style.transform = "rotate(" + 6 * minutes + "deg)"; //設置時針 //12小時 = 360deg 1小時=30deg var hours = date.getHours(); h.style.transform = "rotate(" + 30 * hours + "deg)"; } setTime();函數調用執行 setInterval(setTime,1000);
聲明:本網頁內容旨在傳播知識,若有侵權等問題請及時與本網聯系,我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com