Javascript Tutorial


| Section 1 | Section 2 | Section 3 | Section 4 |
| Section 5 | Section 6 | Section 7 | Section 8 |
| Section 9 | Section 10 |


How do I make a lake applet?
How do I make a snow applet?
How do I make a HawkRay applet?
How do I make my images change on mouseover?



How do I make a lake applet?   (Cross browser) To make a lake applet you have to first upload a file named lake.class to your server. Download the zip file below, unzip it with Winzip or another program, extract the lake.class file where you can easily find it, and upload the lake.class file to your server. Don't attempt to open the file, if you do you'll just get an error. If you don't upload the lake file you won't be able to see the applet. You can download that file here (just make sure to "save it to disk").

Download lake.zip


Put the following code on your page, make sure you substitute your own image filename and double the height of the original image (sometimes you have to adjust the height a little bit):

demo


<applet code="lake" width="your image width" height="double your image height"><param name=image value="yourfilename.gif(or jpg)"></applet>

You can make the lake applet a hyperlink image by adding this code to the above code:

<param name="href" value="your link url.html">

Another effect with this applet is "rock." I think it's weird, and it makes me kinda seasick, but just add this code to the above code to see the effect, you may have to shorten the height of your image:

demo


<param name="rock" value="true">

With some Web hosts you need to put your full image file path in the code (example follows) and make sure that your lake.class file is uploaded to your images file:

<applet code="lake" width="your image width" height="double your image height"><param name=image value="images/yourfilename.gif(or jpg)"></applet>



The above lake applet code was authored by David Griffiths and was used in this tutorial with his written permission, his original "read me" file is included in the lake.zip file.

up


How do I make a snow applet?   (Cross browser) This is another applet that is really easy to make. Upload the snow.class file to your server, and substitute your own image name and image width and height.

Download snow.class


Put the following code on your site, make sure you substitute your own image filename, and your image width and height:

demo


<applet code="alcsnow" width="your image width" height="your image height"><param name="grph" value="yourfilename.jpg or gif"><param name="snows" value="500"><param name="threadsleep" value="50"></applet>

Some hosts require you to put your full image file path in the code (example follows) and make sure that your alcsnow file is uploaded to the same folder that your images are in:

<applet code="alcsnow" width="your image width" height="your image height"><param name="grph" value="images/yourfilename.jpg or gif"><param name="snows" value="500"><param name="threadsleep" value="50"></applet>

up


How do I make a HawkRay applet?   (Cross browser) To make a HawkRay applet you have to first upload 3 files named HawkRay.class, HawkRay$1.class, and Timer.class to your server. Download the zip file below, unzip it into a place where you can easily find it, and upload it to your server. Make sure all the files associated with your applet are in ONE folder, if any of them are in a subfolder it won't work and then you'll write to me saying "your code doesn't work!"

demo


<applet code="HawkRay" width="your image width" height="your image height">
<param name="image" value="your image name.gif">
</applet>

Download HawkRay class files and read me file


This applet is by ©David Griffiths and is included on this site with his written permission

up

How do I make my images change on mouseover?   (Cross browser) Add this code in between the <head> tag and <title> tag (this code is for four images, you can alter this code to make more or less images):

demo




Image 1 is the image you want showing all the time. Image 2 is the image you want to show on mouseover, image 3 is permanent, image 4 is the mouseover...remember to substitute your image filename and width and height attributes.

Next add this code for every mouseover image you insert in your page, this is inserted in the body section of your page:

<a href="yoururl.html" onmouseover="over_image('img0');" onmouseout="off_image('img0')"> <img src="image1.gif" border="0" name="img0"> </a>




up





| About Lissa | Privacy Statement | Contact | Link Us |

Copyright 1997-2016 Lissa, All rights reserved
This Web site is registered with the Library of Congress Copyright Office.


lissaexplains.com


Lissa Explains it All -- HTML Help for KidsHTML Help, css, frames, tables, div layersCustom CursorsHTML Help ForumFree E-mail Service for Kids (and adults who love bright colors ;)Lissa Explains it All -- Free PostcardsLissa Explains it All -- MerchandiseLissa Explains it All -- Guestbook
HTML BasicsHTML TutorialCSS TutorialFrames TutorialTables TutorialColor TutorialFree JavascriptsFun Free Stuff for your siteMySpace TutorialHTML Tutorial
spacer