Hello,
Can anyone please help me. I have a page that I am trying to use a client-side include for the menu (javascript). However, I get about 25 Syntax Errors for line 17.
I don't know what is wrong and I need help please.
Any suggestions are greatly appreciated.
Here is my code for html:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>rsptime.ca: The financial choice, in plain english! - (866) 257-0158 - Home</title>
<link rel="stylesheet" type="text/css" href="style.css">
<script type="text/javascript" language="javascript" src="index.js"></script>
</head>
<body>
<div id="Page">
<div id="Banner">
</div>
<div id="NavBar">
<script src="menu2.js"></script>
</div>
<div id="Content">
<div id="Main" align="justify">
<font class="headings">Highlights</font>
<br />
<br />
<br />
Text Here Text Here Text Here Text Here Text Here Text Here Text Here Text Here Text Here Text Here Text
Text Here Text Here Text Here Text Here Text Here Text Here Text Here Text Here Text Here Text Here Text Here
Text Here Text Here Text Here Text Here Text Here Text Here Text Here Text Here Text Here Text Here Text Here<br>
Text Here Text Here Text Here Text Here Text Here Text Here Text Here Text Here Text Here Text Here Text Here
Text Here Text Here Text Here Text Here Text Here Text Here Text Here Text Here Text Here Text Here Text Here
Text Here Text Here Text Here Text Here Text Here Text Here Text Here Text Here Text Here Text Here Text Here
Text Here Text Here Text Here Text Here Text Here Text Here Text Here Text Here Text Here Text Here Text Here
<br>
<a style="color:#909090" href="pagewhever.html">dfgdggdg</a><br>
<a style="color:#909090" href="pagewhever.html">dfgdggdgdf</a><br>
<br>
Text HereText HereText HereText HereText HereText HereText HereText<br>
Text HereText HereText HereText HereText HereText HereText HereText<br>
Text HereText HereText HereText HereText HereText HereText HereText<br>
Text HereText HereText HereText HereText HereText HereText HereText<br>
Text HereText HereText HereText HereText HereText HereText HereText<br>
Text HereText HereText HereText HereText HereText HereText HereText<br>
Text HereText HereText HereText HereText HereText HereText HereText<br>
Text HereText HereText HereText HereText HereText HereText HereText<br>
Text HereText HereText HereText HereText HereText HereText HereText<br>
<br />
Text HereText HereText HereText HereText HereText HereText HereText<br>
Text HereText HereText HereText HereText HereText HereText HereText<br>
Text HereText HereText HereText HereText HereText HereText HereText<br>
<br />
<!-- this opens a box inside the sell -->
<center>
<fieldset>
<legend><b>Disclaimer</b></legend>
<div id="Disclaimer">
Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello
</div>
</fieldset>
</center>
</div>
<div id="RightMargin">
<table cellspacing="0">
<!-- open 1st row for heading -->
<tr>
<!-- open the cell -->
<td class="subheadings">
Term Insurance
</td><!-- closes the cell -->
</tr> <!-- closes the 1 row for heading -->
<!-- opens second row for the data blurb -->
<tr>
<!-- opens cell with Term Insurance blub & button to quote -->
<td class="tablecontent" style="padding:10px 5px 10px 5px;">
Get the best Term Insurance rates from Canada's leading insurances companies.<br />
<font size="1pt"> <br /></font>
<!-- Button to get quote -->
<center><input name="Button" type="button" class="buttons" value="Get Quote" onClick="window.location ='TermInsurance/index.htm'"></center>
</td><!-- closes the cell with Term Insurance -->
</tr> <!-- closes the 2nd row for Term Insurance -->
</table> <!-- closes the table for Term Insurance -->
<br>
<br>
<br>
<!-- opens the Investing Table -->
<table cellspacing="0">
<!-- open 1st row for heading -->
<tr>
<!-- open cell for Investing heading -->
<td class="subheadings">
Investing
</td> <!-- closes the Investing heading cell -->
</tr> <!-- cloeses the first row for heading -->
<!-- opens row 2 for Investing blurb -->
<tr>
<!-- opens cell for Investing blurb -->
<td class="tablecontent" style="text-align:center; ">
Login and review your portfolio with Ten Star Finanical Inc.<br />
<font size="1pt"><br /></font>
<!-- sets the form to enter login/password -->
<!-- form -->
Login:<br>
<input class="text8" style="width:90px; color:#000000;">
<br>
Password: <br>
<input type="password" style="width:90px; color:#000000;">
<font style="font-size:4pt"><br /><br /></font>
<!-- insert button to track portfolio -->
<input class="buttons" type="submit" value="Track It!" onClick="window.open('http://mpsweb.tenstar.ca/iwb/login.aspx')">
<!-- end of Form -->
</td><!-- closes the cell for Investing blurb -->
</tr> <!-- closes the 2nd row for Investing -->
</table> <!-- closes the table for investing -->
</div>
</div>
</div>
</body>
</html>
Here is the code for menu2.js:
Code:
// JavaScript Document;
document.write('<script type="text/javascript" language="javascript" src="index.js"></script>');
document.write('<div id="Menu">');
document.write('<p id="Item1" class="menuOut" onmouseover="ChangeClass(""Item1"",""menuOver"")" onmouseout="ChangeClass(""Item1"",""menuOut"")" onClick="window.location = ""./index.htm"""><a onmouseover="ChangeClass(""Item1"",""menuOver"")" onmouseout="ChangeClass(""Item1"",""menuOut"")" onClick="window.location = ""./index.htm"""><b>Home</b></a></p>');
document.write('<p id="Item2" class="menuOut" onmouseover="ChangeClass(""Item2"",""menuOver"")" onmouseout="ChangeClass(""Item2"",""menuOut"")" onClick="SwitchMenu(""SubMenu2"")"><a onmouseover="ChangeClass(""Item2"",""menuOver"")" onmouseout="ChangeClass(""Item2"",""menuOut"")" onClick="SwitchMenu(""SubMenu2"")"><b>Learning Centre</b></a></p>');
document.write('<div id="SubMenu2" class="submenu" style="display:none;">');
document.write('• <a href="./Progressive_Tax.htm">Understanding<br> Progressive Tax</a>');
document.write('<p class="line"></p>');
document.write('• <a href="./Financial_Planning.htm">Financial Planning</a>');
document.write('<p class="line"></p>');
document.write('• <a href="Tax_Efficient_Strategies.htm">Tax Efficient<br> Strategies</a>');
document.write('</div>');
document.write('<p id="Item3" class="menuOut" onmouseover="ChangeClass(""Item3"",""menuOver"")" onmouseout="ChangeClass(""Item3"",""menuOut"")" onClick="SwitchMenu(""SubMenu3"")"><a onmouseover="ChangeClass(""Item3"",""menuOver"")" onmouseout="ChangeClass(""Item3"",""menuOut"")" onClick="SwitchMenu(""SubMenu3"")"><b>Insurance</b></a></p>');
document.write('<div id="SubMenu3" class="submenu" style="display:none; ">');
document.write('• <a href="TermInsurance/index.htm"><b>Get Term Quotes</b></a>');
document.write('<p class="line"></p>');
document.write('• <a href="Term_Perm.htm">Term vs. Whole</a><br>');
document.write('<p class="line"></p>');
document.write('• <a href="Buy_Term.htm">Buy Term and<br> Invest the Rest</a>');
document.write('<p class="line"></p>');
document.write('• <a href="ULife.htm">Universal Life</a>');
document.write('<p class="line"></p>');
document.write('• <a href="Beware_MI.htm">Beware of<br> Mortgage Insurance</a>');
document.write('<p class="line"></p>');
document.write('• <a href="Disability.htm">Disability Insurance</a>');
document.write('<p class="line"></p>');
document.write('• <a href="Critical_Illness.htm">Critical Illness<br> Insurance</a>');
document.write('<p class="line"></p>');
document.write('• <a href="Long_Term_Care.htm">Long Term Care<br> Insurance</a>');
document.write('</div>');
document.write('<p id="Item4" class="menuOut" onmouseover="ChangeClass(""Item4"",""menuOver"")" onmouseout="ChangeClass(""Item4"",""menuOut"")" onClick="SwitchMenu(""SubMenu4"")"><a onmouseover="ChangeClass(""Item4"",""menuOver"")" onmouseout="ChangeClass(""Item4"",""menuOut"")" onClick="SwitchMenu(""SubMenu4"")"><b>Investing</b></a></p>');
document.write('<div id="SubMenu4" class="submenu" style="display:none; ">');
document.write('• <a href="RRSP_vs_Open.htm">RRSP vs. Open</a>');
document.write('<p class="line"></p>');
document.write('• <a href="Mutual_vs_Seg.htm">Mutual vs. Seg<br> Funds</a>');
document.write('<p class="line"></p>');
document.write('• <a href="Modern_Portfolio.htm">Modern Portfolio<br> Theory</a>');
document.write('<p class="line"></p>');
document.write('• <a href="Strategic_Asset.htm">Strategic Asset<br> Allocation</a>');
document.write('<p class="line"></p>');
document.write('• <a href="Recommen_Portfolio.htm">Recommend a<br> Portfolio</a>');
document.write('<p class="line"></p>');
document.write('• <a href="window.open(""http://mpsweb.tenstar.ca/iwb/login.aspx"><b>Track Your<br> Portfolio</b></a>');
document.write('</div>');
document.write('<p id="Item5" class="menuOut" onmouseover="ChangeClass(""Item5"",""menuOver"")" onmouseout="ChangeClass(""Item5"",""menuOut"")" onClick="SwitchMenu(""SubMenu5"")"><a onmouseover="ChangeClass(""Item5"",""menuOver"")" onmouseout="ChangeClass(""Item5"",""menuOut"")" onClick="SwitchMenu(""SubMenu5"")"><b>Mortgages</b></a></p>');
document.write('<div id="SubMenu5" class="submenu" style="display:none; ">');
document.write('• <a href="kimcurrie.htm">About Kim Currie</a>');
document.write('<p class="line"></p>');
document.write('• <a href="Mortgage_Rates.htm">Mortgage Rates</a>');
document.write('<p class="line"></p>');
document.write('• <a href="Variable_vs_Fixed.htm">Variable vs. Fixed</a>');
document.write('<p class="line"></p>');
document.write('• <a href="mortgages.htm" href="https://www.mortgageintelligence.ca/secure/app2.cfm?agentid=934887120" target="_blank"><b>Reserve a Rate</b></a>');
document.write('</div>');
document.write('<p id="Item6" class="menuOut" onmouseover="ChangeClass(""Item6"",""menuOver"")" onmouseout="ChangeClass(""Item6"",""menuOut"")" onClick="SwitchMenu(""SubMenu6"")"><a onmouseover="ChangeClass(""Item6"",""menuOver"")" onmouseout="ChangeClass(""Item6"",""menuOut"")" onClick="SwitchMenu(""SubMenu6"")"><b>About Us</b></a></p>');
document.write('<div id="SubMenu6" class="submenu" style="display:none; ">');
document.write('• <a href="About_TenStar.htm">About Ten Star</a>');
document.write('<p class="line"></p>');
document.write('• <a href="About_JimThornton.htm">About Jim Thornton</a>');
document.write('<p class="line"></p>');
document.write('• <a href="KimCurrie.htm">About Kim Currie</a>');
document.write('<p class="line"></p>');
document.write('• <a href="ContactUs.htm">Contact Us</a>');
document.write('</div>');
document.write('</div>');
Here is my code for style.css:
Code:
/* CSS Document */
body {margin:0px; padding:0px; background-color:#666666; font-family:Arial, Helvetica, sans-serif; font-size:8pt;}
#Page {width:780px; height:607px; background-color:#FFFFFF; text-align:left; overflow:hidden;}
#Banner {position:absolute; top:0px; left:0px; width:100%; height:82px; background-image:url("../images/banner.gif"); background-repeat:no-repeat;}
#NavBar {position:absolute; top:82px; left:0px; width:122px; height:521px; border:2px solid #CCCCCC; text-align:center; overflow:auto; overflow-y:auto;}
#Menu {margin:20px 5px 20px 5px; width:112px; height:10px;}
.menuOut {cursor:pointer; margin-top:2px; padding:0px 7px 0px 7px; width:95px; background-color:#DDDDDD; color:#000000; border:1px solid #000000; text-align:left;}
.menuOver {cursor:pointer; margin-top:2px; padding:0px 7px 0px 7px; width:95px; background-color:#222380; color:#FFDF56; border:1px solid #202020; text-align:left;}
.submenu {text-align:left; width:112px;}
.submenu a {color:#960014; text-decoration:none; cursor:pointer;}
.submenu a:hover {color:#222380; text-decoration:none; font-style:normal; font-weight:normal;}
#Menu p {margin:0px 0px 2px 0px;}
#Menu p.line {margin:3px 0px 1px 0px; position:relative; left:0px; width:100%; line-height:0px; border-top:1px solid #960014;}
#Content {position:absolute; top:82px; left:124px; width:652px; height:521px; border:2px solid #CCCCCC; overflow:auto; overflow-y:scroll;}
#Main {position:absolute; top:0px; left:0px; width:424px; height:481px; padding:20px; border-right:2px solid #CCCCCC; color:#505050; text-align:justify;}
#Main .image150wrap {width:274px;}
#AboutUsBlurb {position:absolute; left:195px; width:249px; top:56px; height:20px;}
#Main a {text-decoration:underline; font-weight:bold; color:#505050;}
#Main p {width:420px;}
#RightMargin {position:absolute; top:0px; left:464px; width:170px; height:481px; text-align:center; padding:20px 0px 20px 0px; border-left:2px solid #CCCCCC;}
#RightMargin table {text-align:left;padding:0px 0px 0px 0px; width:150px;}
.subheadings {text-align:center; font-weight:bold; font-size:8pt; color:#FFDF56; background-color:#222380;}
.tablecontent {text-align:justify; padding:10px 10px 10px 10px; color:#505050; background-color:#FFFFFF; border:1px solid #222380;}
#Disclaimer {text-align:justify; margin:0px 8px 7px 8px; height:200px;}
#AppTable.Personal td {padding:2px 2px 2px 2px;}
#AppTable.Questions td {padding:2px 5px 2px 5px; border-bottom:1px solid #222380;}
.headings {font-size:14pt; color:#505050;}
.text8 { font-size:8pt; color:#505050; background-color:#FFFFFF;}
.text6 { font-size:6pt; color:#505050; background-color:#FFFFFF;}
.text4 { font-size:4pt; color:#505050; background-color:#FFFFFF;}
.buttons { font-size:8pt; color:#000000; border-style:outset; cursor:pointer;}
.forms { font-size:8pt;color:#000000;}
.taxtable {border:1px solid #505050;}
.showtextbox {border:0px; width:100%;
font-style:normal; font-weight:normal; font-size:8pt; color:#505050;
background-color:#FFFFFF; text-align:left;}
.indent {width:84%; position:relative; left:8%;}
.BenefitTable {width:100%; border:1px solid #222380; padding:0px;}
.BenefitTableContent {padding:2px 4px 2px 4px; border:1px 1px 1px 1px; border-style:solid; border-color:#222380;}
.infotable {color:#505050; border-left:2px solid #505050; border-bottom:2px solid #505050;}
.subheadingsRED {text-align:center; font-weight:bold; font-size:8pt; color:#FFDF56; background-color:#960014;}
.lists {width:80%; text-align:justify;}
Here is my code for index.js:
Code:
var menu_open = false
function Closeall(){
// get all DIV tags within Menu and load into ar
var ar = document.getElementById("Menu").getElementsByTagName("DIV");
for (var i=0; i<ar.length; i++){
// if DIV ID contains SUBMENU then close
if(ar[i].style.display = "block"){
ar[i].style.display = "none"
}
}
}
function SwitchMenu(obj){
if(document.getElementById){
var el = document.getElementById(obj);
var ar = document.getElementById("Menu").getElementsByTagName("DIV");
Closeall()
if(el.style.display == "none"){
for (var i=0; i<ar.length; i++){
ar[i].style.display = "none";
}
el.style.display = "block";
}
}
}
function ChangeClass(menu, newClass) {
if (document.getElementById) {
document.getElementById(menu).className = newClass;
}
}
document.onselectstart = new Function("return true");
