Forum Moderators: open
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="LeftMenuOnClick('profil.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
Also, I assume just a copy and paste error but you have a line in the segment of menubar.js that reads:
document.write(' <img src="images/menu/menuitem_05.gif"
that was not finished correctly, it need the '>' and a closing bracket.
HTH
Its not actually an ommited >
The three lines that follow (onmouseover, onmouseout and onclick) are actually part of the same document.write where you said the > was missing, so the 4 lines are actually one in the code, thats not the problem.
Any other ideas?
What about having to use / to escape ' or "
Could there be a problem with that?
Hey!
Problem solved, I thought I'd post the solution and also ask another question at the same time:
SOLUTION:
Lines like this..
document.write('<img src="images/menu/menuitem_05.gif"
onmouseover="LeftMenuItemOver(this)"
onmouseout="LeftMenuItemOut(this)"
onclick="LeftMenuOnClick('profil.htm')">
');
..need to have escape characters around 'profil.htm' because otherwise the ' will break the document.write statement!
Here is the correct line:
document.write('<img src="images/menu/menuitem_05.gif"
onmouseover="LeftMenuItemOver(this)"
onmouseout="LeftMenuItemOut(this)"
onclick="LeftMenuOnClick(\'profil.htm\')">
');
But I was immediately hit by another problem.
I thought it would be the same problem with the second js file marguee.js but there are no ' quotes within the writelns!
Here is marquee.js (Displays scrolling text)
document.write('<!--MARGUEE-->');
document.write('<div class="infolineEnvelope">');
document.write(' <div class="infoline">');
document.write(' <marquee direction="left"
scrollAmount="1"
trueSpeed ="true"
SCROLLDELAY="20"
class="InfolineMQ">
');
document.write(' Scrolling text line 1 ');
document.write(' <span class="infolinedivider"> </span>');
document.write(' Scrolling text line 2 ');
document.write(' </marquee>
document.write(' </div>
document.write('</div>
The problem is probably in the marquee parameters line (all one line in the program)
It is called from home.htm like the others but does not work!
Here is home.htm
<html>
<head>
<meta http-equiv="content-type" content="text/html">
<meta http-equiv="Content-language" content="cs">
<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="Scripts/runtime.js"></script>
<title>myTitle</title>
</head>
<body>
<div class="bodyenv">
<!--MENUBAR -->
<script language="javascript" src="menubar.js"></script>
<!--HEADER THIS ALWAYS WORKED-->
<script language="javascript" src="scripts/header.js"></script>
<!--MARGUEE--NOT WORKING-->
<scriptlanguage="javascript"src="marquee.js"></script>
<!--PAGE CONTENT WORKING-->
<script language="javascript" src="home.js"></script>
</div>
</body>
</html>
Both marguee and menubar require functions from runtime.js but if menubar can now access them what is the problem with marquee.js?
Can you help guys?
I include the contents of runtime.js here for completion:
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
}
function FormIconClick(ID)
{
var Src = ID
if (Src.defSrc == null)
Src.defSrc = Src.src.substring(0,Src.src.lastIndexOf('.'));
if (Src.clicked)
{
Src.clicked=false;
Src.src = Src.defSrc + ".gif";
}
else
{
Src.src = Src.defSrc + "_.gif"
Src.clicked=true;
}
}
function LongTextOver(ID)
{
var Src = ID;
if (Src.scrollWidth<=Src.offsetWidth)
return;
if (Src.fullText == null)
{
var newh = document.createElement("DIV");
newh.className='LongTextHint';
newh.style.width=Src.scrollWidth+10;
newh.innerHTML = Src.innerHTML;
Src.fullText = Src.insertAdjacentElement('beforeBegin',newh);
}
else
Src.fullText.style.display='block';
}
function LongTextOut(ID)
{
var Src = ID;
if (Src.fullText!= null)
Src.fullText.style.display='none';
}
function SubmitForm()
{
window.status='Submit';
}
function r(n,v) {
/* DYNAMICKY PRIRADI STYL PODLE POLOHY MYSI NAD DATALISTEM
PARAMETRY>
n( this )- identifikace aktualniho radku
v( integer )- cislo pozadovaneho stylu v rozsahu (1 az 4)
*/
n.className = v;
}
