HTML and CSS Reference
In-Depth Information
EXPLANATION
(
CONTINUED
)
7
A function called
scroller()
is defined.
8
This looks kind of tricky, but here's what's happening. The
substr()
method ex-
tracts everything between the first character and the rest of the string
substr
(
1,
str.length
), resulting in “
nly 19 shopping days left until Christmas!
”. Next, another
subtsr(0,1)
method extracts the first character from the string, the “
O
”. The “
O
” is
added onto the end of the new string, resulting in “
nly 19 shopping days left until
Christmas!O
” and after .3 seconds the
scroll()
function will be called again. Then
the string will become “
ly 19 shopping days left until Christmas!On
”, and then “
19
shopping days left until Christmas!Onl
” and so on. Because the
substr()
method is
being called so rapidly, the effect is a scrolling banner.
9
The new string,
str
, created by the two
substr()
methods will appear in the docu-
ment's title bar. Every time the function is called (i.e., every .3 seconds), the new
string will appear, giving a scrolling effect.
10
The new string will also appear in the status bar of the window.
11
The timer is set here within the
scroller()
function. The first argument is a refer-
ence to a function that will be called, in this case,
scroller
, and the second argu-
ment is when it will be called, in this case, in 300 milliseconds or .3 seconds
(300/1000). Because the
scroller()
function calls itself within the timer, it is recur-
sive and will continue to call itself every .3 seconds until the program ends. The
display is shown in Figure 10.21.
EXAMPLE
10.12
<html>
<head><title><Timeout></title>
<script type="text/javascript">
var today = new Date();
var year=today.getFullYear();
var future = new Date("December 25,"+ year);
var diff = future.getTime() - today.getTime();
// Number of milliseconds
var days =Math.floor(diff / (1000 * 60 * 60 * 24 ));
// Convert to days
var str=
"Only " + days + " shopping days left until Christmas! ";
1
function startup()
{
2
setInterval(scroller,500);
}
3
function scroller(){
str = str.substring(1, str.length) + str.substring(0,1);
document.title=str;
window.status=str;
}
</script>
</head>