» 网友学堂 » Javascript教程 » 时间跳动器
时间跳动器
作者:ljjk5 发表时间:2007-4-8 09:07 阅读:324次 在百度搜索相关内容

脚本说明:
第一步:把如下代码加入<head>区域中
<script language="JavaScript">
<!-- Hide this script from old browsers --

function modRange (value, min, max) {

if (min == max) {

return (min)

}

var low = Math.min (min, max)

var high = Math.max (min, max)

var range = high - low + 1

var valOff = parseInt (value) - low

var mod = range * Math.floor (valOff / range)

result = low + valOff - mod

if (result < low) {

result += high

}

if (result > high) {

result = low

}

return (result)

}

function array () {

this[0] = null

}

function timerAppStart () {

this.stop ()

this.loop ()

}

function timerAppStop () {

clearTimeout (this.timeout)

this.timeout = null

}

function timerAppToggle () {

if (this.timeout) {

this.stop ()

} else {

this.start ()

}

}

function timerAppLoop () {

this.update ()

command = this.name + '.loop()'

for (var i = 0; i < this.syncCount; i++) {

if (this.syncName != '') {

if (--this.syncCountdown <= 0) {

this.syncCountdown = this.syncInterval

command += ';' + this.syncName + '.update()'

}

}

}

this.timeout = setTimeout (command, this.interval)

}

function timerAppSetOutput (output) {

if (! this.output) {

this.output = output

}

}

function timerAppSetInterval (interval) {

if (interval) {

var newInterval = parseInt (interval)

if (newInterval > 0) {

this.interval = newInterval

} else {

alert ('Interval value must be a positive number: ' + interval)

}

}

}

function timerAppSync (name, interval) {

if (interval == null) {

interval = 1

}

if (interval <= 0) {

eval (this.name + '.unsync("' + name + '")')

return

}

var newIndex = this.syncCount

for (var i = 0; i < this.syncCount; i++) {

if (this.syncName == name) {

newIndex = i

break

}

}

if (newIndex == this.syncCount) {

this.syncCount++

}

this.syncInterval[newIndex] = interval

this.syncCountdown[newIndex] = interval

this.syncName[newIndex] = name

}

function timerAppUnsync (name) {

for (var i = 0; i < this.syncCount; i++) {

if (this.syncName == name) {

this.syncName = ''

if (i == (this.syncCount - 1)) {

this.syncCount--

}

}

}

}

function timerAppSetIncrement (increment) {

if (increment) {

var newIncrement = parseInt (increment)

//*Unix only* if (! isNan (newIncrement)) {

if (newIncrement != 0) {

this.increment = newIncrement

} else {

alert ('Increment value must be a number: ' + increment)

}

}

}

function timerAppSetBounce (bounce) {

if (bounce) {

var newBounce = parseInt (bounce)

//*Unix only* if (! isNan (newBounce)) {

if (newBounce != 0) {

this.bounce = newBounce

} else {

alert ('Bounce value must be a number: ' + bounce)

}

}

}

function timerAppSetOffset (offset) {

if (offset) {

var newOffset = parseInt (offset)

if ((newOffset > 0)

&& (newOffset <= this.output.length)) {

this.offset = newOffset

} else {

warnMessage = 'Value of offset must be a valid index (0 - '

+ this.output.length + '): ' + offset

alert (warnMessage)

}

}

}

function clock (name, output, interval) {

// Initialize with default values

this.name = name // object name, needed for setTimeout

this.output = null // output area

this.interval = 1000 // milliseconds

this.timeout = null

this.syncCount = 0

this.syncName = new array ()

this.syncInterval = new array ()

this.syncCountdown = new array ()

// Define object methods

this.update = clockUpdate

this.start = timerAppStart

this.stop = timerAppStop

this.toggle = timerAppToggle

this.loop = timerAppLoop

this.setOutput = timerAppSetOutput

this.setInterval = timerAppSetInterval

this.sync = timerAppSync

this.unsync = timerAppUnsync

// Initialize with specified values

this.setOutput (output)

this.setInterval (interval)

this.start()

}

function clockUpdate () {

var now = new Date()

var timeHH = now.getHours();

var timeMM = now.getMinutes()

var timeSS = now.getSeconds()

var msec = now.getTime ()

var timeSSm = msec - 1000 * Math.floor (msec / 1000)

timeSSm = '00' + timeSSm

timeSSm = timeSSm.substring(timeSSm.length-3, timeSSm.length)

var timeString = ((timeHH < 10) ? '0' : '') + timeHH

+ ':' + ((timeMM < 10) ? '0' : '') + timeMM

+ ':' + ((timeSS < 10) ? '0' : '') + timeSS

+ '.' + timeSSm

if (this.output) {

this.output.value = timeString

} else {

self.status = timeString

}

}

function buttons (name, output, interval, increment, bounce, offset) {

// Initialize with default values

this.name = name

this.output = null

this.interval = 1000

this.increment = 1

this.bounce = 1

this.offset = 0

this.timeout = null

this.syncCount = 0

this.syncName = new array ()

this.syncInterval = new array ()

this.syncCountdown = new array ()

// Define object methods

this.update = buttonsUpdate

this.start = timerAppStart

this.stop = timerAppStop

this.toggle = timerAppToggle

this.loop = timerAppLoop

this.setOutput = timerAppSetOutput

this.setInterval = timerAppSetInterval

this.sync = timerAppSync

this.unsync = timerAppUnsync

this.setIncrement = timerAppSetIncrement

this.setBounce = timerAppSetBounce

this.setOffset = timerAppSetOffset

// Initialize with specified values

this.setOutput (output)

this.setInterval (interval)

this.setIncrement (increment)

this.setBounce (bounce)

this.setOffset (offset)

this.start()

}

function buttonsUpdate () {

if (this.output) {

var newOffset = this.offset + this.increment

if ((newOffset < this.output.length)

&& (newOffset >= 0)) {

this.offset = newOffset

} else {

this.increment *= this.bounce

if (this.increment >= 0) {

this.increment = modRange (this.increment, 0, this.output.length-1)

} else {

this.increment = 0 - modRange (Math.abs (this.increment),

0, this.output.length-1)

}

this.offset += this.increment

this.offset = modRange (this.offset, 0, this.output.length-1)

}

this.output[this.offset].checked = true

}

}

// -- End Hiding Here -->
</script>



第二步:把如下代码加入<body>区域中
<FORM NAME='clock' ACTION=''>

<TABLE BORDER=2><TR><TD>

<FONT SIZE=-2>

<INPUT TYPE='text' NAME='display' SIZE=8



onFocus='wClock.toggle()'



onMouseOver='self.status="Click here to turn on/off clock"; return true'>

</FONT>

</TD></TR></TABLE>

</FORM>

<FORM NAME='imastudios'>

<P>

<INPUT TYPE='radio' NAME='buttons'>

Tick

<INPUT TYPE='radio' NAME='buttons'>

Tock

<INPUT TYPE='radio' NAME='buttons'>

Tick

<INPUT TYPE='radio' NAME='buttons'>

Tock

<INPUT TYPE='radio' NAME='buttons'>

Tick

</FORM>



第三步:把<body>区中内容改为
<body bgcolor="#fef4d9" onLoad='wClock = new clock ("wClock", document.clock.display); wButtons = new buttons ("wButtons", document.imastudios.buttons, 500, 1,-1); wButtons.stop(); wClock.sync ("wButtons", 1)'onUnload='wClock.stop(); wButtons.stop()' bgcolor="#FFFFFF">