最終實現的效果如下，可進入展示頁面檢視
展示頁面：
位於映像標題右側顯示，實時獲取當前時間，各指標隨時間轉動
2023年11月20日div
>
"time_clock"
>
0時0分0秒div
>
"time_weekday"
>
周一div
>
div>
#clock
#clock_
#clock_hour
#clock_minute
#clock_second
//時鐘計時
function
displaytime()
var timestr_weekday =
"周"+weekday_str;
document.
getelementbyid
("time_year"
).innerhtml = timestr_year;
document.
getelementbyid
("time_clock"
).innerhtml = timestr_clock;
document.
getelementbyid
("time_weekday"
).innerhtml = timestr_weekday;
var imghour = document.
getelementbyid
('clock_hour');
var imgmin = document.
getelementbyid
('clock_minute');
var imgsec = document.
getelementbyid
('clock_second');
imghour.style.transform =
'rotate('
+ hour*30+
'deg)'
; imgmin.style.transform =
'rotate('
+ min*6+
'deg)'
; imgsec.style.transform =
'rotate('
+ sec*6+
'deg)';}
intervaltime =
setinterval
(displaytime,
1000
);
時針clock_hour.png
分針clock_minute.png
秒針clock_second.png
html實現旋轉時鐘
旋轉時鐘 html,body clock label let monthtext 一月 二月 三月 四月 五月 六月 七月 八月 九月 十月 十一月 十二月 let daytext 一號 二號 三號 四號 五號 六號 七号 八號 九號 十號 十一號 十二號 十三號 十四號 十五號 十六號 十七號 十...
HTML5之日曆控制項
html5定義了幾個與日期有關的新控制項。支援日期控制項的瀏覽器會提供乙個方便的下拉式日曆，供使用者選擇。以下測試和截圖都是在谷歌瀏覽器完成的，其他瀏覽器可能略有差異。js操作 獲取日期控制項物件 var otimer document.getelementbyid mytime console.l...
PIC32 RTCC實時時鐘和日曆
rtcc實時時間和日曆 結構體定義 rtccdate dt 日期結構體dt.year年,dt.mon月,dt.mday日,dt.wday星期幾，dt.l整體 rtcctime tm 時間結構體tm.hour時,tm.min分,tm.sec秒，tm.l整體 rtccdate adt 鬧鐘時間結構體定義...