Scribd
Upload
13 views3 pages

Chapter 6.1

Uploaded by

op gamer
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
13 views3 pages

Chapter 6.1

Uploaded by

op gamer
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 3

Chapter 6.

Status Bar:
The status bar is located at the bottom of the browser window and is used to display a short message to
visitors on a web page. Developers who are clever to utilize the status bar employ various techniques to
incorporate the status bar in the design of their web page. Some developers display a message on the status
bar when the web page first opens. Other developers might change the message to reflect whatever the
visitor is doing on the web page. For example, if a user is filling registration form then status bar will display
a text as ‘User is on form filling section’.

Building a Static Message:


A static message appears when the web page opens and remains on the status bar until the web page is
closed. The content of the status bar is the value of the window object's status property.
To display a message on the status bar, assign the message to the status property of the window object.
Example:-
window.status= 'You are on home page';

Program:
<html>
<head>
<script type="text/javascript">
window.status='Welcome to Home Page';
</script>
</head>
<body>
<h1>Hello welcome to JavaScript</h1>
</body>
</html>

Output:

Status Bar
Changing the Message Using Rollover:
One can make the status bar message come alive by telling the visitor something about objects the visitor
points to on the web page. The message on the status bar changes as the visitor moves the mouse cursor over
objects on the page. This can be done by using rollover to signal the browser when a different message
should be displayed. An onmouseover event is generated whenever the visitor moves the mouse cursor over
an object on the web page. The browser executes the statement the onmouseover property when an
onmouseover event occurs.
For browser to take multiple actions in response to an onmouseover event, a javascript function can be used
which changes the message on the status bar and does other things when an onmouseover event happens.

Example:
<A onmouseover="DisplayStatusBarMesg(1)">
<B><U>Java Demystified </U></B>
</A>
The browser change the message directly from the onmouseover property.
<A onmouseover= "window.status='10% Discount for Java Demystified!'"><B> <U>Java Demystified
</U></B> </A>

Program:
<html>
<head>
<script type="text/javascript">
window.status="You are in home page"
function displaystatus(no)
{
if(no==1)
{
window.status="You are in CSS"
}
if(no==2)
{
window.status="You are in AJP"
}
if(no==3)
{
window.status="You are in OSY"
}
}
</script>
</head>
<body>
hi welcome
<a onmouseover="displaystatus(1)">CSS</a>
<a onmouseover="displaystatus(2)">AJP</a>
<a onmouseover="displaystatus(3)">OSY</a>
</body>
</html>
In the above example, when user move cursor on CSS/AJP/OSY, status message also change in status bar.
Moving the Message Along the Status Bar
You can give effects to any message on the status bar by displaying letters individually, giving the message
a sense of movement. The message then appears to ripple across the status bar continuously while the visitor
looks around the web page. Movement of the message doesn't stop even during rollovers.

The browser starts by calling the Start() JavaScript function when the web page first loads into the browser.
This happens in the <body> tag, as shown here:
<body onload="Start()">
The Start() function is defined in the JavaScript in the <head> tag. Two statements are included within the
Start() function: Pause() and Display(). The Pause() function temporarily stops the message from moving
along the status bar, and the Display() function causes the text to move along the status bar.

The Pause() function performs two actions:


1. It calls the clearTimeout() function to reset the timeout clock if the message is displayed on the status bar.
The clearTimeout() function is a predefined function that clears the current setting of the timeout clock,
which determines the length of time that the browser pauses. The timeout clock is set in the Display()
function definition. The clearTimeout() function requires one parameter, which is a reference to the clock.
This reference is returned by the setTimeout() function.

2. The Pause() function sets the flag that indicates the message isn't displayed on the status bar. Most of the
real action takes place in the Display() function definition.

You might also like