JavaScript
Welcome to my nightmare. JavaScript is one big pain in the neck. It can be tempermental, picky, and just not very nice at all. But it can do some pretty cool stuff, so it's worth learning. Here are some quick JavaScript scripts that can add a nice touch to your web site.
JavaScript Slide Show
This script involves adding a function to the head section, the onload attribute to the body tag, and a named image to the body section. The end result is a slide show of images.
This first part goes in between the head tags at the top of an HTML document:
<script language="javascript">
<!-- Hide from old browsers
//user defined function for image slideshow
var slides = new Array("ac1.jpg","ac5.jpg","ac3.jpg","ac4.jpg", "ac2.jpg", "ac6.jpg", "ac7.jpg");
var myCntr = 0;
function slideshow() {
myCntr = myCntr + 1;
if (myCntr == 7)
{
myCntr = 0;
}
document.Show.src = slides[myCntr];
setTimeout("slideshow()",3000);
}
//-->
</script>
Next, you must add the onload attribute to the body tag:
<body onload="slideshow();">
Finally, add a named image tag to the body section:
<img src="ac.5jpg" name="Show" width="300" height="250" />
And the result? A nice little slide show, as seen below:
A JavaScript Jump List
This neat little thing requires a function in the head section, and a little more scripting down in the body section. The end result is a pop-up list from which you can select a destination.
First, add this to the head section:
//user defined function for dropdown menu
function go(){
if (document.goHere.goThere.options[document.goHere.goThere.selectedIndex].value != "none")
{
location = document.goHere.goThere.options[document.goHere.goThere.selectedIndex].value;
}
}
Next, add this code to the body section:
<script language="JavaScript" type="text/javascript">
document.write('<form name="goHere"><select name="goThere">');
document.write('<option value=none>Choose Your Destination');
document.write('<option value=none>--------------------');
document.write('<option value="http://www.square-enix.co.jp/dvd/ff7ac/">Square-Enix Official Site');
document.write('<option value="http://www.adventchildren.net">AdventChildren.net');
document.write('<option value="http://www.ff7-2.com/">FF7-2.com');
document.write('</select>');
document.write('<input type="button" value="Go There" onclick="go()">');
document.write('</form>');
</script>
Another Jump List
This one is a little bit simpler. It only requires that you include the following code somewhere in the body section of your HTML document.
<form name="jumpHere">
<select name="landHere" onChange="location=document.jumpHere.landHere.options[document. jumpHere.landHere.selectedIndex].value;" value="GO">
<option selected>Pick Your School
<option value="http://www.uiuc.edu">UIUC
<option value="http://www.umr.edu">UMR
<option value="http://www.parkland.edu">Parkland
</select>
</form>
Well, there's some JavaScript for you. Does it scare you?
|
