Not sure what I'm doing wrong but this just won't work, I've tried a bunch of different methods but I just haven't been able to hit the nail on the head.


The html page code looks like this:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>

</head>

<body text="#FF0000" link="#FF0000 vlink="#FF0000">
<script type="text/javascript" src="menu.js"/></script>

</body>
</html>

The Javascript File looks like this:

function LmOver(elem, clr)
{elem.style.backgroundColor = clr;
elem.children.tags('A')[0].style.color = "#FFFFFF";
elem.style.cursor = 'hand'}
function LmOut(elem, clr)
{elem.style.backgroundColor = clr;
elem.children.tags('A')[0].style.color = "#FF0000";}
function LmDown(elem, clr)
{elem.style.backgroundColor = clr;
elem.children.tags('A')[0].style.color = "#FFFFFF";}
function LmUp(path)
{location.href = path;}
document.write("
<table border=\"0\" width=\"120\" bgcolor=\"#FF0000\" cellspacing=\"0\" cellpadding=\"0\"><tr><td width=\"100%\">
<table border=\"0\" width=\"100%\" cellspacing=\"1\" cellpadding=\"1\"><tr>
<td width=\"100%\" onMouseover=\"LmOver("+this, '#CCCCCC'+")\" onMouseout=\"LmOut("+this, '#000000'+")\" onMouseDown=\"LmDown("+this, '#CCCCCC'+")\" onMouseUp=\"LmUp("+'news.htm'+")\" bgcolor=\"#000000\"><A HREF=\"news.htm\">News</a></td></tr></table>
</td></tr>
</table>
");

can someone please tell me what I'm doing wrong?

Quoted strings (such as in your document.write statement) cannot have have line breaks in them.

You should give each tag written a separate document.write function.

Maybe I misunderstood, but I changed the javascript file to this:

function LmOver(elem, clr)
{elem.style.backgroundColor = clr;
elem.children.tags('A')[0].style.color = "#FFFFFF";
elem.style.cursor = 'hand'}
function LmOut(elem, clr)
{elem.style.backgroundColor = clr;
elem.children.tags('A')[0].style.color = "#FF0000";}
function LmDown(elem, clr)
{elem.style.backgroundColor = clr;
elem.children.tags('A')[0].style.color = "#FFFFFF";}
function LmUp(path)
{location.href = path;}
document.write("<table border=\"0\" width=\"120\" bgcolor=\"#FF0000\" cellspacing=\"0\" cellpadding=\"0\">");
document.write("<tr>");
document.write("<td width=\"100%\">");
document.write("<table border=\"0\" width=\"100%\" cellspacing=\"1\" cellpadding=\"1\">");
document.write("<tr>");
document.write("<td width=\"100%\" onMouseover=\"LmOver("+this, '#CCCCCC'+")\" onMouseout=\"LmOut("+this, '#000000'+")\"onMouseDown=\"LmDown("+this, '#CCCCCC'+")\" onMouseUp=\"LmUp("+'news.htm'+")\" bgcolor=\"#000000\">");
document.write("<A HREF=\"news.htm\">News</a>");
document.write("</td>");
document.write("</tr>");
document.write("</table>");
document.write("</td>");
document.write("</tr>");
document.write("</table>");

The link will show up now, but the onMouseover commands do not function properly.

I found the problem with the onMouseover commands, it was back in the html file, however by having to remove designations in the html file now I have to go back to using the CSS which also does want to link up right.

the body tag of the html was edited to only display the background color as such:

<body bgcolor="#000000">

which got the on mouseover working again

the link in the javascript needed to be updated

document.write("<A HREF=\"news.htm\" Class=\"navlink\">&nbsp; News</a>");

as for the css I tried several differnt ways of inserting it. I did a direct insert into the javascript file, but that didn't work. I also tried doing a link inside the javascript file and that didn't work. I did a link into the html file and that didn't work. So I tried a direct insert into the html file and that didn't work either.

when I did links the code looked like this:

<link type="text/css" href="menucss.css" />

The CSS looks like this:

<style type="text/css">
<!--
.Navlink {COLOR: #FF0000; TEXT-DECORATION: none; font-family: arial; font-size: 10pt; font-weight: bold;}
a:link.Navlink  {color : #FF0000;}
a:visited.Navlink  {color : #FF0000;}
a:active.Navlink  {text-decoration: none;}
a:hover.Navlink  {text-decoration: none;}
-->
</style>

What do I need to do to get the remote javascript file and css to cooperate?

I solved it. The missing factor was in the link command.

<link type="text/css" href="menucss.css" rel="stylesheet" />

and it works perfect

This article has been dead for over six months. Start a new discussion instead.