Javascript
Here I'm going to show you a few nifty little javascript things, and at the end, I'll give
you the address of a page where you can learn some more, if you're interested. If you don't
have a javascript-enabled browser, you might as well skip this section, because if you screw up,
you won't know it, and people who get a bunch of javascript errors when they go to a site hardly
ever come back.
It seems that people deliberately try to make javascript look hard. I had a hell of a time
finding anything that actually taught you how to do it, most "tutorials" on javascript are just
trying to get you to use their own (copyrighted, of course) programs. So I was amazed when I
found out how easy it actually was.
This is a command that makes a certain text appear in the status bar at the bottom of the page
whenever the mouse is over it:
<A href="http://members.xoom.com/FrogQueen/sitelist.html"
onmouseover="window.status='visit all of my sites from one page!';return true"
onmouseout="window.status='Document: Done';return true"> Honey's Sites.. </A>
Here's what it means:
- onmouseover onmouseout
This indicates when the code should start working.
- window.status
This specifies what sort of command it is.. in this case, that it puts text in the status bar.
- the text within the apostrophes
This text is what you want to appear in the status bar. I always put Document: Done in the
onmouseout one so that the status bar looks normal. If you don't use onmouseout, the text you
indicate in onmouseover will stay in the status bar until the mouse passes over another link
with the same command, or the visitor moves to another page. Because the text for the status
bar is enclosed in apostrophes, if you try to use an apostrophe the normal way in the text you
will get an error message. So, for apostrophes within this command, use this code:
’ (which looks like: ).
- return true
I'm not entirely certain, but without this command, the code doesn't work, so I'm pretty sure
that it makes sure the whole thing runs.
NOTE: From onmouse... to return true", you must not hit enter. Any break in the code will cause
javascript errors.
Here's how it looks:
Honey's Sites..
And, of course, there's the ever-loving pop-up alert box. Please use these sparingly, and
never on a main page.
<SCRIPT>
<!--
alert("Hi there!")
// -->
</SCRIPT>
That's all there is to it!
Here's how it works:
- <SCRIPT> </SCRIPT>
These indicate that these are script commands.
- <!-- // -->
This will hide your script from older browsers that don't support it.
- alert
This specifies the type of thing the script is supposed to do.
- ("Hi there!")
This specifies what the alert box says.
To make it work, the best thing to do is enclose it in your HEAD commands. Here's how to set
that up..
<HTML>
<HEAD>
<TITLE> Alert box page </TITLE>
<SCRIPT>
<!--
alert("Hi there!")
// -->
</SCRIPT>
</HEAD>
<BODY BGCOLOR=ffffff>
<center> NIFTY, HUNH? </center>
</BODY>
</HTML>
Here's how it looks.
This is a way to make a message pop up when someone presses a button on your page. You can
use it in a normal form code, too.
<CENTER> <FORM> <INPUT type="button" value="DONT
PRESS!" onClick="alert
('DONT PRESS IT AGAIN!') "> </FORM> </CENTER>
After the last one, this should be pretty much self-explanatory.
It looks like this:
Try it!
If you want to learn more about javascript applications, check out the Netscape page:
JavaScript Guide
Or, this version was easier to understand:
Javascript Guide
Back to the tutorial menu