如何在博客中插入实时钟

你想要什么样的时间显示格式？

是数码的还是传统的中国时钟？

下面有几种时钟代码可供参考：

漂亮的手表样的时钟:

1：第一步:把如下代码加入>body>区域中

>SCRIPT language=JavaScript>

>!-- Beginning of JavaScript -

var now

var second

var minute

var hour

var degreeSecond

var degreeMinute

var degreeHour

var timer

var stepDegree=6

var stepDegreeHour=30

function checkTime() {

if (document.all) {

now=new Date()

second=now.getSeconds()

minute=now.getMinutes()

hour=now.getHours()

if (hour>=12) {hour=hour-12}

spinIt()

timer=setTimeout("checkTime()",200)

}

}

function spinIt() {

window.status=hour

secondObj.SetIdentity()

minuteObj.SetIdentity()

hourObj.SetIdentity()

degreeSecond=180+stepDegree*second

degreeMinute=180+stepDegree*minute

degreeHour=180+stepDegreeHour*hour+(Math.floor(stepDegree*minute/12))

secondObj.Rotate(0,0,degreeSecond)

minuteObj.Rotate(0,0,degreeMinute)

hourObj.Rotate(0,0,degreeHour)

}

// - End of JavaScript - -->

>/SCRIPT>

>DIV style="LEFT: 340pxPOSITION: absoluteTOP: 100px">

>DIV style="LEFT: 0pxPOSITION: absoluteTOP: 0px">>IMG height=102

src="bgclock.gif" width=100>>/DIV>

>DIV style="LEFT: 0pxPOSITION: absoluteTOP: 0px">

>OBJECT classid=CLSID:369303C2-D7AC-11D0-89D5-00A0C90833E6 height=14

id=secondObj style="HEIGHT: 102pxWIDTH: 100px" width=14>>PARAM NAME="HighQuality" VALUE="1">>PARAM NAME="Line0001" VALUE="SetFillStyle(1)">>PARAM NAME="Line0002" VALUE="SetLineColor(80,20,20)">>PARAM NAME="Line0003" VALUE="SetFillColor(80,20,20)">>PARAM NAME="Line0004" VALUE="Rect(0,0,1,32)">>/OBJECT>>/DIV>

>DIV style="LEFT: 0pxPOSITION: absoluteTOP: 0px">

>OBJECT classid=CLSID:369303C2-D7AC-11D0-89D5-00A0C90833E6 height=14

id=minuteObj style="HEIGHT: 102pxWIDTH: 100px" width=14>>PARAM NAME="HighQuality" VALUE="1">>PARAM NAME="Line0001" VALUE="SetFillStyle(1)">>PARAM NAME="Line0002" VALUE="SetLineColor(50,50,50)">>PARAM NAME="Line0003" VALUE="SetFillColor(50,50,50)">>PARAM NAME="Line0004" VALUE="Rect(0,0,1,30)">>/OBJECT>>/DIV>

>DIV style="LEFT: 0pxPOSITION: absoluteTOP: 0px">

>OBJECT classid=CLSID:369303C2-D7AC-11D0-89D5-00A0C90833E6 height=14 id=hourObj

style="HEIGHT: 102pxWIDTH: 100px" width=14>>PARAM NAME="HighQuality" VALUE="1">>PARAM NAME="Line0001" VALUE="SetFillStyle(1)">>PARAM NAME="Line0002" VALUE="SetLineColor(50,50,50)">>PARAM NAME="Line0003" VALUE="SetFillColor(50,50,50)">>PARAM NAME="Line0004" VALUE="Rect(0,0,1,16)">>/OBJECT>>/DIV>>/DIV>

>DIV

style="COLOR: #444444FONT-SIZE: 8ptLEFT: 200pxLETTER-SPACING: 0.6emLINE-HEIGHT: 200%POSITION: absoluteTEXT-ALIGN: centerTOP: 20pxWIDTH: 200pxfomnt-family: Verdana">>/DIV>

第二步:修改>body***>中的内容，将下面的代码加入原>body***>中

onload=checkTime()

2.挂历的时间显示

<SCRIPT language=JavaScript>

function Year_Month(){

var now = new Date()

var yy = now.getYear()

var mm = now.getMonth()+1

var cl = '<font color="#0000df">'

if (now.getDay() == 0) cl = '<font color="#c00000">'

if (now.getDay() == 6) cl = '<font color="#00c000">'

return(cl + yy + '年' + mm + '月</font>')}

function Date_of_Today(){

var now = new Date()

var cl = '<font color="#ff0000">'

if (now.getDay() == 0) cl = '<font color="#c00000">'

if (now.getDay() == 6) cl = '<font color="#00c000">'

return(cl + now.getDate() + '</font>')}

function Day_of_Today(){

var day = new Array()

day[0] = "星期日"

day[1] = "星期一"

day[2] = "星期二"

day[3] = "星期三"

day[4] = "星期四"

day[5] = "星期五"

day[6] = "星期六"

var now = new Date()

var cl = '<font color="#0000df">'

if (now.getDay() == 0) cl = '<font color="#c00000">'

if (now.getDay() == 6) cl = '<font color="#00c000">'

return(cl + day[now.getDay()] + '</font>')}

function CurentTime(){

var now = new Date()

var hh = now.getHours()

var mm = now.getMinutes()

var ss = now.getTime() % 60000

ss = (ss - (ss % 1000)) / 1000

var clock = hh+':'

if (mm <10) clock += '0'

clock += mm+':'

if (ss <10) clock += '0'

clock += ss

return(clock)}

function refreshCalendarClock(){

document.all.calendarClock1.innerHTML = Year_Month()

document.all.calendarClock2.innerHTML = Date_of_Today()

document.all.calendarClock3.innerHTML = Day_of_Today()

document.all.calendarClock4.innerHTML = CurentTime()}

var webUrl = webUrl

document.write('<table border="0" cellpadding="0" cellspacing="0"><tr><td>')

document.write('<table id="CalendarClockFreeCode" border="0" cellpadding="0" cellspacing="0" width="60" height="70" ')

document.write('style="position:absolutevisibility:hidden" bgcolor="#eeeeee">')

document.write('<tr><td align="center"><font ')

document.write('style="cursor:handcolor:#ff0000font-family:宋体font-size:14ptline-height:120%" ')

if (webUrl != 'netflower'){

document.write('</td></tr><tr><td align="center"><font ')

document.write('style="cursor:handcolor:#2000fffont-family:宋体font-size:9ptline-height:110%" ')

}

document.write('</td></tr></table>')

document.write('<table border="0" cellpadding="0" cellspacing="0" width="61" bgcolor="#C0C0C0" height="70">')

document.write('<tr><td valign="top" width="100%" height="100%">')

document.write('<table border="1" cellpadding="0" cellspacing="0" width="58" bgcolor="#FEFEEF" height="67">')

document.write('<tr><td align="center" width="100%" height="100%" >')

document.write('<font id="calendarClock1" style="font-family:宋体font-size:7ptline-height:120%"></font><br>')

document.write('<font id="calendarClock2" style="color:#ff0000font-family:Arialfont-size:14ptline-height:120%"></font><br>')

document.write('<font id="calendarClock3" style="font-family:宋体font-size:9ptline-height:120%"></font><br>')

document.write('<font id="calendarClock4" style="color:#100080font-family:宋体font-size:8ptline-height:120%"><b></b></font>')

document.write('</td></tr></table>')

document.write('</td></tr></table>')

document.write('</td></tr></table>')

setInterval('refreshCalendarClock()',1000)

</SCRIPT>

3.实时走动的时钟

<SCRIPT LANGUAGE="JavaScript">

<!-- Begin

fCol = '000000' //face colour.

sCol = 'ff0000' //seconds colour.

mCol = '000000' //minutes colour.

hCol = '000000' //hours colour.

H = '....'

H = H.split('')

M = '.....'

M = M.split('')

S = '......'

S = S.split('')

Ypos = 0

Xpos = 0

Ybase = 8

Xbase = 8

dots = 12

ns = (document.layers)?1:0

if (ns) {

dgts = '1 2 3 4 5 6 7 8 9 10 11 12'

dgts = dgts.split(' ')

for (i = 0i <dotsi++) {

document.write('<layer name=nsDigits'+i+' top=0 left=0 height=30 width=30><center><font face=Arial,Verdana size=1 color='+fCol+'>'+dgts[i]+'</font></center></layer>')

}

for (i = 0i <M.lengthi++) {

document.write('<layer name=ny'+i+' top=0 left=0 bgcolor='+mCol+' clip="0,0,2,2"></layer>')

}

for (i = 0i <H.lengthi++) {

document.write('<layer name=nz'+i+' top=0 left=0 bgcolor='+hCol+' clip="0,0,2,2"></layer>')

}

for (i = 0i <S.lengthi++) {

document.write('<layer name=nx'+i+' top=0 left=0 bgcolor='+sCol+' clip="0,0,2,2"></layer>')

}

}

else {

document.write('<div style="position:absolutetop:0pxleft:0px"><div style="position:relative">')

for (i = 1i <dots+1i++) {

document.write('<div id="ieDigits" style="position:absolutetop:0pxleft:0pxwidth:30pxheight:30pxfont-family:Arial,Verdanafont-size:10pxcolor:'+fCol+'text-align:centerpadding-top:10px">'+i+'</div>')

}

document.write('</div></div>')

document.write('<div style="position:absolutetop:0pxleft:0px"><div style="position:relative">')

for (i = 0i <M.lengthi++) {

document.write('<div id=y style="position:absolutewidth:2pxheight:2pxfont-size:2pxbackground:'+mCol+'"></div>')

}

document.write('</div></div>')

document.write('</div></div>')

document.write('<div style="position:absolutetop:0pxleft:0px"><div style="position:relative">')

for (i = 0i <H.lengthi++) {

document.write('<div id=z style="position:absolutewidth:2pxheight:2pxfont-size:2pxbackground:'+hCol+'"></div>')

}

document.write('</div></div>')

document.write('<div style="position:absolutetop:0pxleft:0px"><div style="position:relative">')

for (i = 0i <S.lengthi++) {

document.write('<div id=x style="position:absolutewidth:2pxheight:2pxfont-size:2pxbackground:'+sCol+'"></div>')

}

document.write('</div></div>')

}

function clock() {

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/6 + Math.PI*parseInt(time.getMinutes())/360

if (ns) {

Ypos = window.pageYOffset+window.innerHeight-60

Xpos = window.pageXOffset+window.innerWidth-80

}

else {

Ypos = document.body.scrollTop + window.document.body.clientHeight - 60

Xpos = document.body.scrollLeft + window.document.body.clientWidth - 60

}

if (ns) {

for (i = 0i <dots++i){

document.layers["nsDigits"+i].top = Ypos - 5 + 40 * Math.sin(-0.49+dots+i/1.9)

document.layers["nsDigits"+i].left = Xpos - 15 + 40 * Math.cos(-0.49+dots+i/1.9)

}

for (i = 0i <S.lengthi++){

document.layers["nx"+i].top = Ypos + i * Ybase * Math.sin(sec)

document.layers["nx"+i].left = Xpos + i * Xbase * Math.cos(sec)

}

for (i = 0i <M.lengthi++){

document.layers["ny"+i].top = Ypos + i * Ybase * Math.sin(min)

document.layers["ny"+i].left = Xpos + i * Xbase * Math.cos(min)

}

for (i = 0i <H.lengthi++){

document.layers["nz"+i].top = Ypos + i * Ybase * Math.sin(hrs)

document.layers["nz"+i].left = Xpos + i * Xbase * Math.cos(hrs)

}

}

else{

for (i=0i <dots++i){

ieDigits[i].style.pixelTop = Ypos - 15 + 40 * Math.sin(-0.49+dots+i/1.9)

ieDigits[i].style.pixelLeft = Xpos - 14 + 40 * Math.cos(-0.49+dots+i/1.9)

}

for (i=0i <S.lengthi++){

x[i].style.pixelTop = Ypos + i * Ybase * Math.sin(sec)

x[i].style.pixelLeft = Xpos + i * Xbase * Math.cos(sec)

}

for (i=0i <M.lengthi++){

y[i].style.pixelTop = Ypos + i * Ybase * Math.sin(min)

y[i].style.pixelLeft = Xpos + i * Xbase * Math.cos(min)

}

for (i=0i <H.lengthi++){

z[i].style.pixelTop = Ypos + i * Ybase*Math.sin(hrs)

z[i].style.pixelLeft = Xpos + i * Xbase*Math.cos(hrs)

}

}

setTimeout('clock()', 50)

}

if (document.layers || document.all) window.onload = clock

// End -->

</script>

给blog增加flash精美时钟

发现了很多绚丽的FLASH钟表,免费,没有广告的可以使用,颜色也可选择,安装也方便。

你可以预览后选择自己喜欢的。

刻度时钟：

<EMBED SRC=http://www.butabon.com/Clock/clock_038.swf WIDTH=150 HEIGHT=150 wmode=transparent quality=high loop=true menu=false>

其中的http://www.butabon.com/Clock/clock_038.swf是时钟的flash地址，可以在IE中预览，其中的038可以替换成000-039之间或者051-059之间的任何一个数字(全看个人喜好，呵呵)

数字时钟：

第一种风格：

<EMBED SRC=http://www.butabon.com/Clock/digiwide019.swf WIDTH=150 HEIGHT=15 wmode=transparent quality=high loop=true menu=false>

其中的http://www.butabon.com/Clock/digiwide019.swf同样是时钟的flash地址，可以在IE中预览，其中的019可以替换成000-019之间之间的任何一个数字(同样全看个人喜好，呵呵)

第二种风格：

<EMBED SRC=http://www.butabon.com/Clock/digital_019.swf WIDTH=150 HEIGHT=90 wmode=transparent quality=high loop=true menu=false>

其中的http://www.butabon.com/Clock/digital_019.swf同样是时钟的flash地址，可以在IE中预览，其中的019可以替换成000-019之间之间的任何一个你可以在IE中可以成功预览的数字(请自己测试)。

更多blog特效请见：http://blog.csdn.net/kvw3000/archive/2004/07/14/41178.aspx

---