HTML and CSS Reference
In-Depth Information
1
•
Click the blank
text field name to
construct object
to assign message
with JavaScript
form id attribute to
construct object
line 67 below the
<div class=”center-
div”> tag.
•
Enter the HTML code
form and text
field for scrolling
message
shown in Table 10-1
on the previous
page to create the
form and text field
(Figure 10-3).
Can a scrolling
message be placed in
other Web elements in addition to text fields?
Besides a text field, any object that can have values assigned to it, such as a button,
the status bar, or a title bar can be used to display a scrolling text message.
Figure 10-3
Creating the scrollingMsg() User-Defined Function
The scrollingMsg() function requires two variables and performs five tasks.
The two variables are:
The adMsg variable represents the message.
Placement of
Scrolling Text
Although scrolling text
can be assigned to a <div>
tag container using the
innerHTML property, the
<div> tag container does
not allow for as much
control as a form object
like a text field or button.
•
•
The five tasks the scrollingMsg() function performs are:
Assigns the string message to the display object (which, in this project, is the text field)•
The beginPos variable represents the current character in the text message.
•
•
Increments the beginPos variable by 1 to place the next character in the text message
in the display object
Uses an if statement to test for the end of the message
•
•
If the text has scrolled to the end of the message, starts over with the first character
•
Makes the display continuous and regulates the speed of the display using the
setTimeout() method set to 200 milliseconds
Table 10-2 shows the code to begin the JavaScript section, declare and initialize
the adMsg and beginPos variables, declare the scrollingMsg() function, and assign the first
characters of the message to the text field.
Table 10-2 Code to Begin the scrollingMsg() Function
Line
Code
6
<script type=”text/javascript”>
7
<!--Hide from old browsers
8
var adMsg=” ** Did you know some used cars can have 100% loan value?
Ask for details! ** “
9
var beginPos=0
10
function scrollingMsg() {
11
msgForm.scrollingMsg.value=adMsg.substring(beginPos,
adMsg.length)+adMsg.substring(0,beginPos)
