<HTML>
<HEAD>
<SCRIPT LANGUAGE="javascript">
<!-- sample javascript
alert('This box was created using javascript');
//end of script -->
</SCRIPT>
<TITLE>
Chapter 11
</TITLE>
</HEAD>
<BODY BGCOLOR="green">
<CENTER>
<H1>Welcome to Chapter 11</H1>
<img SRC="beach.jpg" USEMAP="#beach" BORDER="0">

<MAP NAME="beach">
  <AREA SHAPE="rect" COORDS="85,80,115,100"
  HREF="dad.html" ALT="Dad">
<AREA SHAPE="rect" COORDS="170,125,195,145"
  HREF="jon.html" ALT="Jon">
<AREA SHAPE="rect" COORDS="220,125,250,145"
  HREF="tim.html" ALT="Me">
</MAP>
<BR> 
Move the cursor over our faces and click. 
<P>
<P>
<IMG SRC="animation3.gif"><BR>
<FONT color="red">Check out my animated gif<BR>
It was made with JASC Animation Shop</FONT>
<P><FONT color="green"><B>More Fun With Javascript:</B>
<P>
<P>
<A HREF="javaspt2.html"
  onMouseOver="window.status='created by Timothy Allen Kreider';return true"
  onMouseout="window.status=' '; return true"> 
Drag the mouse over me and watch watch the status line below.<BR> This was done with the on MouseOver command</A>
<P>
The above link text has dissappeared for some reason. I'll try to get it back.<BR>
I figured it out....the letters are the same color as the background.
<FORM> 
   <INPUT type="button" value="CLick here and look at the status bar below" name="button2" onClick="window.status='You clicked the button! - Javascript'; return true"> 
</FORM>
   <FORM> 
     <INPUT type="button" value="Change to Yellow!" name="button3" onClick="document.bgColor='yellow'"> <br> 
     <INPUT type="button" value="Change to Red!" name="button4" onClick="document.bgColor='red'"> <br> 
     <INPUT type="button" value="Change back!" name="button5" onClick="document.bgColor='green'"> </FORM> 
<FORM> 
<INPUT type="button" value="Go to my main page!" name="button6" onClick="window.location='htmlpractice.html'"> 
</FORM>
     <A HREF="noplace" onMouseover="alert('Pretty annoying huh?')"> Don't click this link!</A><BR> 
     <A HREF="https://websitesetup.org">CLick here to continue the javascript lesson</A>
<P>
</FONT>

</CENTER>

<SCRIPT LANGUAGE="JavaScript">
<!--
//The logo animates when the cursor is over it.
logo_on = new Image();          // on image
logo_off = new image()          //and off image
logo_on.src = 'logo-on.gif';    //set the actual graphic
logo_off.src = 'logo-off.gif';
function activate(image) {      // from 'off' to 'on'
   imagesrc=eval(image+'_on.src');
   document[image].src = imagesrc;
}

function deactivate(image) {   from 'on' to 'off'
   imagesrc=eval(image+"_off.src");
   document[image].src = imagesrc;
}

// end of script
</SCRIPT>

<CENTER>
<A HREF="logo.html"
  OnMouseOver="activate('logo');return true;"
  OnMouseOut="deactivate('logo');return true;" >
<IMG SRC="logo-off.gif" ALT="[Kreider Inc.]" BORDER=0
   NAME='logo'></A>
<BR>This thing is not working the way it should.<BR>
So I'm giving up on it for now. (p.225)
</CENTER>
</BODY>
</HTML>