Hi!
I am editing a website, removing javascript that is repeated on each page and placing it in external files. I can do it for text or images (see header.js) but the mouseover menubar uses other js functions which were originally in a external js called runtime.js.
How can I include or call the functions from runtime.js in my menubar.js file?
We are dealing with four files.
home.html
runtime.js
header.js
menubar.js
There is also a CSS (uses Czech naming and comments!)
home.htm (Here is a shortened version)
<html>
<head>
<link rel=”Stylesheet” type=”text/css” href=”stylyNN.css” DISABLED>
<SCRIPT LANGUAGE=”JavaScript1.2″ TYPE=”text/javascript”>
<!–
if (document.all) document.createStyleSheet(“styly.css”);
//–>
</SCRIPT>
<script language=”JavaScript” src=”runtime.js”></script>
<title>myTitle</title>
</head>
<body>
<div class=”bodyenv”>
<!–MENUBAR– NOT WORKING–>
<script language=”javascript” src=”menubar.js”></script>
<!–HEADER– WORKING–>
<script language=”javascript” src=”scripts/header.js”></script>
</div>
</body>
</html>
runtime.js (functions for mouseover etc)
function LeftMenuItemOver(ID)
{
var Src = ID
if (Src.defSrc == null)
Src.defSrc = Src.src.substring(0,Src.src.lastIndexOf(‘.’));
Src.src = Src.defSrc + “_.gif”
}
function LeftMenuItemOut(ID)
{
var Src = ID
Src.src = Src.defSrc + “.gif”
}
function LeftMenuOnClick(urlAddress)
{
window.location.href = urlAddress
}
header.js (My new file, I simply removed the html from home.htm
and placed it in header.js using document.write()
statements.)
document.write(‘<!–HEADER –>’);
document.write(‘<div class=”nadpis”>’);
document.write(‘ <!–SMALL FLAGS, UK, GERMANY, FRANCE, SPAIN–>’);
document.write(‘ <div class=”smallflags”>’);
document.write(‘ <img src=”images/cw_flag_uk_small.gif” >’);
document.write(‘ <img src=”images/cw_flag_ge_small.gif” >’);
document.write(‘ <img src=”images/cw_flag_fr_small.gif” >’);
document.write(‘ <img src=”images/cw_flag_small.gif” >’);
document.write(‘ </div>’);
document.write(‘ <img class=”cwflag” src=”images/cw_flag_cz.gif”>’);
document.write(‘ <img src=”images/topbar.gif”>’);
document.write(‘</div>’);
menubar.js (THIS IS THE PROBLEM FILE! Like header.js I simply cut
the code from home.htm and put it in this file with
document.writes)
document.write(‘<!–MENUBAR –>’);
document.write(‘ <div class=”levy-sloupecEnv”>’);
document.write(‘ <div class=”LeftMenuItems”>’);
document.write(‘ <img src=”images/menu/menuitem_03__.gif” >’);
document.write(‘ <img src=”images/menu/menuitem_05.gif”
onmouseover=”LeftMenuItemOver(this)”
onmouseout=”LeftMenuItemOut(this)”
onclick=”LeftMenuOnClic(‘xx.htm’)”>’);
document.write(‘ </div>’);
document.write(‘</div>’);
The line with the onmouseover calls a function from runtime.js which is called in the head of the home.htm.
If I remove this line the .js file is called and the image in the line above it (menuitem_03) is displayed.
If the code in this menubar.js file is placed directly in the bosy of home.htm (As it was originally) it works fine, but I need it in an external file (menubar.js) but it doesn’t work, WHY? I have tried copying the functions directly from runtime.js into menubar.js but its still no good!
The CSS file couldn’t be part of the problem could it? I doubt it.
Your help would be greatly appreciated, I’ve been at this for three days!!
David O’Sullivan