dropdown
Navigate Here
Mini-tutorial
This is called a mini-tutorial, because I don't have time to explain the use of javascripts and CSS from the beginning. If you have experience with HTML and adding (not writing) scripts, you should be able to figure out what everything is used for. A good rule of thumb for beginners is to start out small, change only links and names of links and change only one thing at a time so you know what you did if the page crashes. The dropdown menu code is from dynamicdrive.com.

There are 6 uses of Javascript in this template in addition to Cascading Style Sheets (CSS):
  • Dropdown Menu (also uses CSS for placement)
  • Navigate Here button mouseover on index pages
  • Preload so that the Navigate Here mouseover works immediately
  • Date
  • User open/close pop-up window
  • Status text on non-index pages

If you are looking for backwards compatibility in older browsers, this is not a good choice. This template requires Netscape and IE 4+. I haven't tested it in other browsers, so I don't know how/if it will work in them.

On the index file, if you click on the ©, another little window opens that can be closed by clicking on close in the window itself. The file in the little window is called copyright.html, insert your name in to the copyright notice.

To use this template, change the links at the top of the page:
menu1[0]='<font face=Arial size=2><b><a href=mini_tutorial.html>Link 1 </a></font><br>'
Unless you know javascript, only change the the name of the HTML file and the name of the link. I've highlighted these in pink above. Do not add quotes( " ) before and after the name of the HTML file or the javascript will not work.
You can also change the name and size of the font or get rid of it all together. These are highlighted in yellow.
Change or get rid of the links below the same way, except you can leave the quotes( " ) in since they aren't in javascript.

Using the Blank Page Template (blank.html):
After your vistors enter your site, you will probably want them to go to a page like this one as opposed the opening HTML with more graphics. I've provided a blank template for you to use. If you open blank.html in your HTML editor, you will see this HTML code:
<!-- Start your text below -->
Use this page as a template for your additional pages.
<!-- End your text above -->
Simply replace the text between Start and End with whatever you want to say.

The javascripts make this a little complicated, but they also make it more interesting, too!

 

This template was brought to you FREE by... www.SerenityMedia.co.uk want us to build your site for you using this template? E-Mail us at sitedesign@serenitymedia.co.uk

home OutWorldArts
OutWorld Arts