Floating fixed position images that stay in one location as you scroll the web page. You can see a sample of this in the lower right corner of your browser window. Scroll this page up and down to see how this works. Check back, I'll try to add more images in the future.

September 11, 2001 Height=24, Width=30

U.S. Flag Height=18,Width=30

Dale Earnhardt 3 Height=45,Width=42

POW/MIA Tribute Height=43,Width=32

If you would like to add one of these images to your web page there are only a few things you need to do. Right click (control click Mac) on the image that you want to add to your site and save it to your computer. Write down the dimension listed below the image you save and the name of the file that you saved, you will need these in a minute. Copy the contents of the first text box below and paste it into your html file somewhere in the head part of your code. You will need to change the values for the variables imgwidth and imgheight to the numbers you wrote down earlier. You should also change the alt in the image tag to an appropriate desciption of your image. This alt description is the text that shows up when your mouse is over the image. Click here and press Ctrl+C (Command+C Mac) to save the entire code <SCRIPT LANGUAGE="JavaScript"> <!-- Begin // You will need to set the variables imgwidth and imgheight function setVariables() { imgwidth=30; // logo width, in pixels imgheight=24; // logo height, in pixels if (navigator.appName == "Netscape") { horz=".left"; vert=".top"; docStyle="document."; styleDoc=""; innerW="window.innerWidth"; innerH="window.innerHeight"; offsetX="window.pageXOffset"; offsetY="window.pageYOffset"; } else { horz=".pixelLeft"; vert=".pixelTop"; docStyle=""; styleDoc=".style"; innerW="document.body.clientWidth"; innerH="document.body.clientHeight"; offsetX="document.body.scrollLeft"; offsetY="document.body.scrollTop"; } } function checkLocation() { objectXY="branding"; var availableX=eval(innerW); var availableY=eval(innerH); var currentX=eval(offsetX); var currentY=eval(offsetY); x=availableX-(imgwidth+25)+currentX; y=availableY-(imgheight+20)+currentY; evalMove(); setTimeout("checkLocation()",10); } function evalMove() { eval(docStyle + objectXY + styleDoc + horz + "=" + x); eval(docStyle + objectXY + styleDoc + vert + "=" + y); } // End --> </SCRIPT> Copy the code out of the next text box and you will paste that into your actual body tag. If you already have an onload statement in your body tag add the new ones after the one you have separating them with a ";". If you need a sample of this you can view the source for this page for an example. Click here and press Ctrl+C (Command+C Mac) to save the entire code onload="setVariables(); checkLocation();" The last step is to copy the code out of the last text box just below and paste it into your code somewhere in the body of your code. I pasted mine in just after the body tag. Once again you can see this by viewing the source. After you paste this in you will need to change "filename" to the file you saved above. Also change the height and width to the numbers you wrote down earlier. If you don't like where it is positioned on your page try playing with the left and top variables. If you are using layers in your page you may have to change the zindex. Click here and press Ctrl+C (Command+C Mac) to save the entire code <div id="branding" style="position:absolute; visibility:show; left:235px; top:-50px; z-index:2"> <img src="usflag.gif" width="30" height="24" border="0" alt="In memory - 9.11.01."> Back to main page.