二十四小时时钟代码,JS代码库,德仔网

代码语言
代码分类
【JS】二十四小时时钟
作者:dezai / 发布于2014/9/20/ 789

	脚本说明:
	
	把如下代码加入<body>区域中
	<script language="JavaScript">
	<!--

	
	f1Col='ccccc0';//face colour.
	f2Col='ccccc0';//face colour.
	d1Col='ff0000';//dot colour.
	d2Col='ff0000';//dot colour.

	hCol='00ff00';//hours colour.
	mCol='00ff00';//minutes colour.
	sCol='00ff00';//seconds colour.
	ClockHeight=50;
	ClockWidth=50;

	//Alter nothing below! Alignments will be lost!

	h=10;
	m=7;
	s=7;

	face24='06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 01 02 03 04 05';
	face24=face24.split(' ');
	n1=face24.length;
	face12='15 20 25 30 35 40 45 50 55 0 5 10';
	face12=face12.split(' ');
	n2=face12.length;
	p="<font face=Arial size=1 color=#"+f1Col+">";
	p2="<font face=Arial size=1 color=#"+f2Col+">";

	
	e=360/n1;
	e2=360/n2
	e3=360/60

	HandHeight=ClockHeight/6;
	HandWidth=ClockWidth/6;
	y=0;
	x=0;

	ns6=(document.getElementById&&!document.all);
	ns=(document.layers);
	ie=(document.all);

	if (ns){
	for (i=0; i < n1; i++)
	document.write('<layer name="nshour24'+i+'" top=0 left=0 height=15 width=15><center>'+p+face24[i]+'</font></center></layer>');
	for (i=0; i < n1; i++)
	document.write('<layer name=nsdots1'+i+' top=0 left=0 bgcolor='+d1Col+' clip="0,0,2,2"></layer>');
	for (i=0; i < n2; i++)
	document.write('<layer name="nshour12'+i+'" top=0 left=0 height=15 width=15><center>'+p2+face12[i]+'</font></center></layer>');
	for (i=0; i < 12; i++)
	document.write('<layer name=nsdots2'+i+' top=0 left=0 bgcolor='+d2Col+' clip="0,0,2,2"></layer>');
	for (i=0; i < h; i++)
	document.write('<layer name=nsH'+i+' top=0 left=0 bgcolor='+hCol+' clip="0,0,2,2"></layer>');
	for (i=0; i < m; i++)
	document.write('<layer name=nsM'+i+' top=0 left=0 bgcolor='+mCol+' clip="0,0,2,2"></layer>');
	for (i=0; i < s; i++)
	document.write('<layer name=nsS'+i+' top=0 left=0 bgcolor='+sCol+' clip="0,0,2,2"></layer>');
	}
	if (ie||document.getElementById){
	for (i=0; i < n1; i++)
	document.write('<div id="hour24'+i+'" style="position:absolute;top:0px;left:0px;width:15px;height:15px;text-align:center">'+p+face24[i]+'</font></div>');
	for (i=0; i < n1; i++)
	document.write('<div id="dots1'+i+'" style="position:absolute;top:0px;left:0px;width:2px;height:2px;font-size:2px;background:#'+d1Col+'"></div>');
	for (i=0; i < n2; i++)
	document.write('<div id="hour12'+i+'" style="position:absolute;top:0px;left:0px;width:15px;height:15px;text-align:center">'+p2+face12[i]+'</font></div>');
	for (i=0; i < 12; i++)
	document.write('<div id="dots2'+i+'" style="position:absolute;top:0px;left:0px;height:2px;width:2px;font-size:2px;background:#'+d2Col+'"></div>');
	for (i=0; i < h; i++)
	document.write('<div id="ieH'+i+'" style="position:absolute;top:0px;left:0px;width:2px;height:2px;font-size:2px;background:#'+hCol+'"></div>');
	for (i=0; i < m; i++)
	document.write('<div id="ieM'+i+'" style="position:absolute;top:0px;left:0px;width:2px;height:2px;font-size:2px;background:#'+mCol+'"></div>');
	for (i=0; i < s; i++)
	document.write('<div id="ieS'+i+'" style="position:absolute;top:0px;left:0px;width:2px;height:2px;font-size:2px;background:#'+sCol+'"></div>');
	}

	
	function Scroll(){
	if (ns){
	y=window.pageYOffset+window.innerHeight-ClockHeight*2;
	x=window.pageXOffset+window.innerWidth-ClockWidth*2.3;
	}
	if (ns6){
	y=window.pageYOffset+window.innerHeight-ClockHeight*2.1;
	x=window.pageXOffset+window.innerWidth-ClockWidth*2.2;
	}
	if (ie){
	y=document.body.scrollTop+window.document.body.clientHeight-ClockHeight*2;
	x=document.body.scrollLeft+window.document.body.clientWidth-ClockWidth*2;
	}
	setTimeout('Scroll()',50);
	}
	Scroll();

	function ClockAndAssign(){
	time = new Date ();
	secs = time.getSeconds();
	sec = -1.57 + Math.PI * secs/30;
	mins = time.getMinutes();
	min = -1.57 + Math.PI * mins/30;
	hr = time.getHours();
	hrs = -1.57 + Math.PI * hr/12 + Math.PI*parseInt(time.getMinutes())/720;
	for (i=0; i < s; i++){
	var cs=(ns)?document.layers['nsS'+i]:(ie)?document.all['ieS'+i].style:document.getElementById("ieS"+i).style;
	cs.top=y+(i*HandHeight)*Math.sin(sec);
	cs.left=x+(i*HandWidth)*Math.cos(sec);
	}
	for (i=0; i < m; i++){
	var cm=(ns)?document.layers['nsM'+i]:(ie)?document.all['ieM'+i].style:document.getElementById("ieM"+i).style;
	cm.top=y+(i*HandHeight)*Math.sin(min);
	cm.left=x+(i*HandWidth)*Math.cos(min);
	}
	for (i=0; i < h; i++){
	var ch=(ns)?document.layers['nsH'+i]:(ie)?document.all['ieH'+i].style:document.getElementById("ieH"+i).style;
	ch.top=y+(i*HandHeight)*Math.sin(hrs);
	ch.left=x+(i*HandWidth)*Math.cos(hrs);
	}
	for (i=0; i < 12; i++){
	var d2=(ns)?document.layers['nsdots2'+i]:(ie)?document.all['dots2'+i].style:document.getElementById("dots2"+i).style;
	d2.top=y + ClockHeight*Math.sin(-1.0471 + i*e2*Math.PI/180);
	d2.left=x + ClockWidth*Math.cos(-1.0471 + i*e2*Math.PI/180);
	}
	for (i=0; i < n2; i++){
	var h12=(ns)?document.layers['nshour12'+i]:(ie)?document.all['hour12'+i].style:document.getElementById("hour12"+i).style;
	h12.top=y-6 + ClockHeight*1.2*Math.sin(i*e2*Math.PI/180);
	h12.left=x-6 + ClockWidth*1.2*Math.cos(i*e2*Math.PI/180);
	}
	for (i=0; i < n1; i++){
	var d1=(ns)?document.layers['nsdots1'+i]:(ie)?document.all['dots1'+i].style:document.getElementById("dots1"+i).style;
	d1.top=y + ClockHeight*1.5*Math.sin(-1.0471 + i*e*Math.PI/180);
	d1.left=x + ClockWidth*1.5*Math.cos(-1.0471 + i*e*Math.PI/180);
	}
	for (i=0; i < n1; i++){
	var h24=(ns)?document.layers['nshour24'+i]:(ie)?document.all['hour24'+i].style:document.getElementById("hour24"+i).style;
	h24.top=y-6 + ClockHeight*1.7*Math.sin(i*e*Math.PI/180);
	h24.left=x-6 + ClockWidth*1.7*Math.cos(i*e*Math.PI/180);
	}
	setTimeout('ClockAndAssign()',500);
	}
	ClockAndAssign();

	
	//-->
	</script>
	固定的长针为时针，短针为分针，转动的当然是秒针了
评论列表
本站所提供的代码，版权归原作者所有，若有侵犯作者版权，请与我们联系，我们将立即删除或修改。谢谢!
本站所有代码发布及提供者。
试试其它关键字
　二十四小时时钟　　二十四小时　　时钟　
同语言下
可能有用的
dezai贡献的其它代码(1065)