Phiên bản đầy đủ: jsB@nk » Thời gian » Đồng hồ » Đồng hồ kim
URL: https://www.javascriptbank.com/military-time-clock-script.html
Một đoạn mã JavaScript JavaScript khác để tạo đồng hồ kim trên trang web.
Phiên bản đầy đủ: jsB@nk » Thời gian » Đồng hồ » Đồng hồ kim
URL: https://www.javascriptbank.com/military-time-clock-script.html
<script>if ((document.getElementById) && window.addEventListener || window.attachEvent){(function(){//Configure the clock colours and size here.var fCol = '#666666'; //face colour.var dCol = '#666666'; //dot colour.var hCol = '#00ff00'; //hours colour.var mCol = '#0000ff'; //minutes colour.var sCol = '#ff0000'; //seconds colour.var cHgt = 50; //clock height. var cWdh = 50; //clock width. //If used inside a table td, its minimum width should //be cWdh x 4. Netscape td's do not auto expand! //End.var y = cHgt * 2;var x = cWdh * 2;var h = 7;var m = 5;var s = 5;var face24 = "06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 0 01 02 03 04 05";face24 = face24.split(" ");var n1 = face24.length;var face12 = "15 20 25 30 35 40 45 50 55 0 5 10";face12 = face12.split(" ");var n2 = face12.length;var e1 = 360/n1;var e2 = 360/n2;var e3 = 360/60;var hHgt = cHgt/4;var hWdh = cWdh/4;var h24 = [];var d1 = [];var h12 = [];var d2 = [];var vh = [];var vm = [];var vs = [];var pix = "px";var idx = document.getElementsByTagName('div').length;document.write('<div style="position:relative;width:'+((x*2))+'px;height:'+((y*2))+'px;">');for (i=0; i < n1; i++){document.write('<div id="hour24'+(idx+i)+'" style="position:absolute;top:0px;left:0px;width:15px;height:15px;'+'text-align:center;font-family:verdana,arial,sans-serif;font-size:10px;color:'+fCol+'">'+face24[i]+'<\/div>');document.write('<div id="dots1'+(idx+i)+'" style="position:absolute;top:0px;left:0px;'+'width:2px;height:2px;font-size:2px;background-color:'+dCol+'"><\/div>');}for (i=0; i < n2; i++){document.write('<div id="hour12'+(idx+i)+'" style="position:absolute;top:0px;left:0px;width:15px;height:15px;'+'text-align:center;font-family:verdana,arial,sans-serif;font-size:10px;color:'+fCol+'">'+face12[i]+'<\/div>');}for (i=0; i < 12; i++){document.write('<div id="dots2'+(idx+i)+'" style="position:absolute;top:0px;left:0px;'+'width:2px;height:2px;font-size:2px;background-color:'+dCol+'"><\/div>');}for (i=0; i < h; i++){document.write('<div id="H'+(idx+i)+'" style="position:absolute;top:0px;left:0px;'+'width:2px;height:2px;font-size:2px;background-color:'+hCol+'"><\/div>');}for (i=0; i < m; i++){document.write('<div id="M'+(idx+i)+'" style="position:absolute;top:0px;left:0px;'+'width:2px;height:2px;font-size:2px;background-color:'+mCol+'"><\/div>');}for (i=0; i < s; i++){document.write('<div id="S'+(idx+i)+'" style="position:absolute;top:0px;left:0px;'+'width:2px;height:2px;font-size:2px;background-color:'+sCol+'"><\/div>');}document.write('<\/div>');function MilClock(){var time = new Date();var secs = time.getSeconds();var secOffSet = secs - 15;if (secs < 15){ secOffSet = secs+45;}var sec = Math.PI * (secOffSet/30);var mins = time.getMinutes();var minOffSet = mins - 15;if (mins < 15){ minOffSet = mins+45;}var min = Math.PI * (minOffSet/30);var hrs = time.getHours();var hrOffSet = hrs - 6;if (hrs < 6){ hrOffSet = hrs+18;}var hr = Math.PI * (hrOffSet/12) + Math.PI * time.getMinutes()/720;for (i=0; i < s; i++){ vs[i].top = y + (i*hHgt) * Math.sin(sec) + pix; vs[i].left = x + (i*hWdh) * Math.cos(sec) + pix;}for (i=0; i < m; i++){ vm[i].top = y + (i*hHgt) * Math.sin(min) + pix; vm[i].left = x + (i*hWdh) * Math.cos(min) + pix;}for (i=0; i < h; i++){ vh[i].top = y + (i*hHgt) * Math.sin(hr) + pix; vh[i].left = x + (i*hWdh) * Math.cos(hr) + pix;}setTimeout(MilClock,100);}function init(){for (i=0; i < n1; i++){ h24[i] = document.getElementById("hour24"+(idx+i)).style; h24[i].top = y - 6 + cHgt * 1.7 * Math.sin(i*e1*Math.PI/180) + pix; h24[i].left = x - 6 + cWdh * 1.7 * Math.cos(i*e1*Math.PI/180) + pix; d1[i] = document.getElementById("dots1"+(idx+i)).style; d1[i].top = y + cHgt * 1.5 * Math.sin(i*e1*Math.PI/180) + pix; d1[i].left= x + cWdh * 1.5 * Math.cos(i*e1*Math.PI/180) + pix;}for (i=0; i < n2; i++){ h12[i] = document.getElementById("hour12"+(idx+i)).style; h12[i].top = y - 6 + cHgt * 1.2 * Math.sin(i*e2*Math.PI/180) + pix; h12[i].left = x - 6 + cWdh * 1.2 * Math.cos(i*e2*Math.PI/180) + pix;}for (i=0; i < 12; i++){ d2[i] = document.getElementById("dots2"+(idx+i)).style; d2[i].top = y + cHgt * Math.sin(i*e2*Math.PI/180) + pix; d2[i].left= x + cWdh * Math.cos(i*e2*Math.PI/180) + pix;}for (i=0; i < h; i++){ vh[i] = document.getElementById("H"+(idx+i)).style;}for (i=0; i < m; i++){ vm[i] = document.getElementById("M"+(idx+i)).style;}for (i=0; i < s; i++){ vs[i] = document.getElementById("S"+(idx+i)).style;}MilClock();}if (window.addEventListener){ window.addEventListener("load",init,false);}else if (window.attachEvent){ window.attachEvent("onload",init);} })();}//End.</script><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->