View Full Version : How can I "include" a page with JS on another html page?

08-12-2005, 08:04 PM
I am using FrontPage. I have created a html page with a JavaScript mouseover menu, and I would like to use "include" to incorporate this menu into all my other web site pages, without have to put the JS declarations into each individual page (which kind of defeats the purpose of the include). The "include" only brings in the "body" piece of the JS, but not the code that is needed in the "head".

Is there a way I can do this? Can I use a style sheet? I am not very experienced with style sheets. What kind of syntex would I use?

08-12-2005, 08:24 PM
You can use a javascript include:

Just put the script into another file without script tags and give it a .js extention. Then reference it like this:

<script type="text/javascript" src="yourpage.js"></script>

and place it where you would normally place the whole code.


08-14-2005, 03:33 AM
Thanks! The instructions you sent worked great.

One more related question tho:
On the same html page where I am using this first js include I asked you about, there is also another JS script that I would like to add. I assume I can add a second reference with a second JS include with the other file name on my html page.

But this is my problem.
The second JS script (for a dropdown menu) starts out with a CSS style type before the JS script tags actually start.

<style type="text/css">
border:1px solid black;
border-bottom-width: 0;
font:normal 12px Times New Roman;

#dropmenudiv a{
width: 100%;
display: block;
text-indent: 3px;
border-bottom: 1px solid black;
padding: 1px 0;
text-decoration: none;
font-weight: bold;


#dropmenudiv a:hover{ /*hover background color*/



Then the JS begins:
<script type="text/javascript">

//Contents for menu 1
var menu1=new Array()
menu1[0]='<a href="http://www.scout_team.com">Uniform Order Form</a>'
menu1[1]='<a href="http://www.scout_team.com">Letter of Acceptance</a>'
menu1[2]='<a href="http://scout_tema.com">New Player Tryouts/Registration Form</a>'
menu1[3]='<a href="http://scout_team.com">CSS Drive</a>'


I have created separate .js & .css files (both without the script tags).
First I tried calling both the .js and the.css files from my html page, which didn't work.

Then I then tried calling the .css file from the .js file, and calling only the .js file from the html page. That didn't work either. Altho I don't know whether my syntax for calling the files was correct.

When I tried calling the both the .js & .css files from my html page I tried using either:
<link rel="stylesheet" type="text/css" href=dropdowntest.css">
<script type="text/javascript" src="dropdown.js"></script>

<script type="text/css" src="dropdowntest.css"></script>
<script type="text/javascript" src="dropdown.js"></script>

I got a syntax errors with both.

Then I tried calling only the .js from my html page, and calling the .css file from the .js file:
In the html page I used:
<script type="text/javascript" src="dropdown.js"></script>

In the .js file I used:
<link rel="stylesheet" type="text/css" href="dropdowntest.css">

I also tried using, in the .js file:
<script type="text/css" src="dropdowntest.css"></script>

For both I got menu undefined.

Is there a way I can do this?