Newbie Drop Down Menu

[winndknot]

Hello everyone, I am new to your forum and really need some assistance. I have Javascript, CSS, and Html that I am using to create a drop down menu. I have managed to make it, however when I publish it, it goes no where on the hover or even on the click. I would be very grateful if someone could tell me where I am going wrong...been looking at if for days and can't seem to find the problem, nor any help. Thanks for taking a look.

For viewing ease I copied and pasted the codes from Wordpad to a MS Word file, not able to upload (too large) so here is the codes:

CSS code named uploaded to hstrial-rprice on homestead and published 
Named in Notepad:  symphonycode.css


.basictab{ 
padding: 3px 0; 
margin-left: 0; 
font: bold 14px arial; 
border-bottom: 0px solid darkgoldenrod; 
list-style-type: none; 
margin-bottom: 0; 
text-align: center; /*set to left, center, or right to align the menu as desired*/ 
} 

.basictab li{ 
display: inline; 
margin: 0; 
} 

.basictab li a{ 
text-decoration: none; 
padding: 3px 7px; 
margin-right: 3px; 
border: 1px solid black; 
/*border-bottom: none;*/ 
background-color: #785a14; /* first level menu */ 
color: white; 
} 

.basictab li a:visited{ 
color: white; 
} 

.basictab li a:hover{ 
background-color: #3E3535; /*Grey29 */ 
color: white; 
} 

.basictab li a:active{ 
color: white; /*white */ 
} 

.basictab li.selected a{ /*selected tab effect*/ 
position: relative; 
top: 1px; 
padding-top: 4px; 
background-color: #820000; 
color: white; 
} 

.submenustyle{ 
padding: 2px 1px; 
font: 13px arial; 
border: 0px solid black; 
border-top-width: 0; 
width: auto; 
display: none; 
filter:alpha(opacity=0); 
-moz-opacity:0; 
} 

* html .submenustyle{ /*IE only width definition*/ 
width: 100%; 
} 

.submenustyle a{ 
border-right: 0px solid white; 
padding: 1px 5px; 
background: white; /*suthers added*/ 
color: #820000; 
text-decoration: none; 
} 

.submenustyle a:hover{ 
background-color: #CCCCCC; /* was #6D7B8D; */ 
} 




Javacript code named symphonycode.js uploaded to hstrial-rprice on homestead and published 




var mastertabvar=new Object() 
mastertabvar.baseopacity=0 
mastertabvar.browserdetect="" 

function showsubmenu(masterid, id){ 
if (typeof highlighting!="undefined") 
clearInterval(highlighting) 
submenuobject=document.getElementById(id) 
mastertabvar.browserdetect=submenuobject.filters? "ie" : typeof submenuobject.style.MozOpacity=="string"? "mozilla" : "" 
hidesubmenus(mastertabvar[masterid]) 
submenuobject.style.display="block" 
instantset(mastertabvar.baseopacity) 
highlighting=setInterval("gradualfade(submenuobject)",50) 
} 

function hidesubmenus(submenuarray){ 
for (var i=0; i<submenuarray.length; i++) 
document.getElementById(submenuarray[i]).style.display="none" 
} 

function instantset(degree){ 
if (mastertabvar.browserdetect=="mozilla") 
submenuobject.style.MozOpacity=degree/100 
else if (mastertabvar.browserdetect=="ie") 
submenuobject.filters.alpha.opacity=degree 
} 


function gradualfade(cur2){ 
if (mastertabvar.browserdetect=="mozilla" && cur2.style.MozOpacity<1) 
cur2.style.MozOpacity=Math.min(parseFloat(cur2.style.MozOpacity)+0.1, 0.99) 
else if (mastertabvar.browserdetect=="ie" && cur2.filters.alpha.opacity<100) 
cur2.filters.alpha.opacity+=10 
else if (typeof highlighting!="undefined") //fading animation over 
clearInterval(highlighting) 
} 

function initalizetab(tabid){ 
mastertabvar[tabid]=new Array() 
var menuitems=document.getElementById(tabid).getElementsByTagName("li") 
for (var i=0; i<menuitems.length; i++){ 
if (menuitems[i].getAttribute("rel")){ 
menuitems[i].setAttribute("rev", tabid) //associate this submenu with main tab 
mastertabvar[tabid][mastertabvar[tabid].length]=menuitems[i].getAttribute("rel") //store ids of submenus of tab menu 
if (menuitems[i].className=="selected") 
showsubmenu(tabid, menuitems[i].getAttribute("rel")) 
menuitems[i].getElementsByTagName("a")[0].onmouseover=function(){ 
showsubmenu(this.parentNode.getAttribute("rev"), this.parentNode.getAttribute("rel")) 
} 
} 
} 
} 

Here is what I have under the insert html element at HS

<ul id="maintab" class="basictab"> 
<li rel="Home"><a href="http://www.dreamsonthefly.com/index.html">Home</a><li> 

<li rel="Owyhee River"<a href="http://www.dreamsonthefly.com/owyhee.html">Owyhee River</a> 
</li> 

<li rel="Steelhead"><a href="#">Steelhead</a></li> 
<li rel="Rates"><a href="#">Rates</a><li> 
<li rel="Bass"><a href="#">Bass</a></li> 
<li rel="Wilderness"><a href="#">Wilderness</a></li> 
<li rel="Flies"><a href="#">Flies</a></li>
<p> 
<li rel="Our Guides"><a href="#">Our Guides</a></li>
<li rel="Corporate Trips"><a href="#">Corporate Trips</a></li> 
<li rel="Education"><a href="#">Education</a></li>
<li rel="Blog"><a href="#">Blog</a></li> 
<li rel="Contact Us"><a href="#">Contact Us</a></li> 
<li rel="Trip Planning"><a href="#">Trip Planning</a></li> 
</P></ul> 

<div id="Home" class="submenustyle"> 
</div> 

<div id="Steelhead" class="submenustyle"> 

<a href="http://www.dreamsonthefly.com/Granderonde.html">Grande Ronde</a> 
<a href="http://www.dreamsonthefly.com/faqssteel.html">Faq's About Steelhead</a> 
</div> 


<div id="Smallmouth Bass" class="submenustyle"> 
<a href="http://www.dreamsonthefly.com/bass.html">Why Smallmouth Bass on a Fly</a> 
<a href="http://www.dreamsonthefly.com/bass.html">Smallmouth on the Grande Ronde</a> 
<a href="http://www.dreamsonthefly.com/bassl.html">Smallmouth Bass on Other Rivers</a> 
</div> 

<div id="Rates" class="submenustyle"> 
<a href="http://www.dreamsonthefly.com/singlerates.html">Single Day Guide Rates for Trout</a> 
<a href="http://www.dreamsonthefly.com/multidayrates.html">Multi-day Guided Trips f</a> 
</div>  


<div id="Wilderness" class="submenustyle"> 
<a href="http://www.dreamsonthefly.com/wilderness.html">A Quiet Walk with the Wilderness</a> 
<a href="http://www.dreamsonthefly.com/diamond.html">Diamond D Ranch</a> 
</div> 

<div id="Flies" class="submenustyle"> 
<a href="http://www.dreamsonthefly.com/flies.html">About Dave Tucker's Flies</a> 
<a href="http://www.dreamsonthefly.com/allflyinfo.html"Steelhead Flies</a> 
<a href="http://www.dreamsonthefly.com/troutflies.html">Trout Flies</a> 
<a href="http://www.dreamsonthefly.com/atlanticsalmonflies.html">Beautiful Atlantic Salmon Flies</a> 
</div> 


<div id="Our Guides" class="submenustyle"> 
<a href="http://www.dreamsonthefly.com/newguides.html">About Dave Tucker</a> 
<a href="http://www.dreamsonthefly.com/newguides.html">About Rhonda Price</a> 
<a href="http://www.dreamsonthefly.com/newguides.html">About John Schaeffer</a>
<a href="http://www.dreamsonthefly.com/newguides.html">About Zach Mayhew</a> 
<a href="http://www.dreamsonthefly.com/newguides.html">About our camp crew</a> 
</div> 

<div id="Corporate Trips" class="submenustyle"> 
<a href="http://www.dreamsonthefly.com/corporatepackages.html">Team Building</a> 
<a href="http://www.dreamsonthefly.com/corporatepackages.html">Customer Incentives</a> 
<a href="http://www.dreamsonthefly.com/corporatepackages.html">Employee Incentives</a> 
</div>
 
<div id="Education" class="submenustyle"> 
<a href="http://www.dreamsonthefly.com/education.html">Knots</a> 
<a href="http://www.dreamsonthefly.com/education.html">The Great Release</a> 
<a href="http://www.dreamsonthefly.com/education.html">Ettiquite on the Water</a> 
</div> 

<div id="Blog" class="submenustyle"> 
<a href="http://dreamsonthefly.blogspot.com">Where are We, What are We Doing?</a>
</div> 

<div id="Contact Us" class="submenustyle"> 
<a href="http://www.dreamsonthefly.com/comments.html">Contact Us</a> 
<a href="http://www.dreamsonthefly.com/comments.html">Guest Book</a> 
<a href="http://www.dreamsonthefly.com/comments.html">Sign Up for Our Newsletter</a> 
</div> 

<div id="Trip Planning" class="submenustyle"> 
<a href="http://www.travelstoremaker.com/cgit/porch?agentid=dreamsonthefly">Easy Airline Reservations </a> 
<a href="http://www.flybook.com/">Make Your Guide Reservations Here</a>
<a href="http://www.dreamsonthefly.com/">What You Need to Bring</a>
</div> 

<script type="text/javascript"> 
//initialize tab menu, by passing in ID of UL 
initalizetab("maintab") 
</script>


Here is what I have in the advanced tab in the page properties for the site.

<link rel="stylesheet" type="text/css" href="http://www.dreamsonthefly.com/symphonycode.css" /> 

<script type="text/javascript" src="http://www.dreamsonthefly.com/symphonycode.js"> 
/*********************************************** 
* 2 level Horizontal Tab Menu- by JavaScript Kit (www.javascriptkit.com) 
* This notice must stay intact for usage 
* Visit JavaScript Kit at http://www.javascriptkit.com/ for full source code 
***********************************************/ 

</script>

[vwphillips]

you have HTML errors , missing tags + spaces in id name(not allowed)

<body>
<ul id="maintab" class="basictab">
<li rel="Home"><a href="http://www.dreamsonthefly.com/index.html">Home</a></li>

<li rel="Owyhee River"><a href="http://www.dreamsonthefly.com/owyhee.html">Owyhee River</a></li>

<li rel="Steelhead"><a href="#">Steelhead</a></li>
<li rel="Rates"><a href="#">Rates</a><li>
<li rel="Bass"><a href="#">Bass</a></li>
<li rel="Wilderness"><a href="#">Wilderness</a></li>
<li rel="Flies"><a href="#">Flies</a></li>
<p>
<li rel="OurGuides"><a href="#">Our Guides</a></li>
<li rel="CorporateTrips"><a href="#">Corporate Trips</a></li>
<li rel="Education"><a href="#">Education</a></li>
<li rel="Blog"><a href="#">Blog</a></li>
<li rel="ContactUs"><a href="#">Contact Us</a></li>
<li rel="TripPlanning"><a href="#">Trip Planning</a></li>
</P></ul>

<div id="Home" class="submenustyle">
</div>

<div id="Steelhead" class="submenustyle">

<a href="http://www.dreamsonthefly.com/Granderonde.html">Grande Ronde</a>
<a href="http://www.dreamsonthefly.com/faqssteel.html">Faq's About Steelhead</a>
</div>


<div id="Smallmouth Bass" class="submenustyle">
<a href="http://www.dreamsonthefly.com/bass.html">Why Smallmouth Bass on a Fly</a>
<a href="http://www.dreamsonthefly.com/bass.html">Smallmouth on the Grande Ronde</a>
<a href="http://www.dreamsonthefly.com/bassl.html">Smallmouth Bass on Other Rivers</a>
</div>

<div id="Rates" class="submenustyle">
<a href="http://www.dreamsonthefly.com/singlerates.html">Single Day Guide Rates for Trout</a>
<a href="http://www.dreamsonthefly.com/multidayrates.html">Multi-day Guided Trips f</a>
</div>


<div id="Wilderness" class="submenustyle">
<a href="http://www.dreamsonthefly.com/wilderness.html">A Quiet Walk with the Wilderness</a>
<a href="http://www.dreamsonthefly.com/diamond.html">Diamond D Ranch</a>
</div>

<div id="Flies" class="submenustyle">
<a href="http://www.dreamsonthefly.com/flies.html">About Dave Tucker's Flies</a>
<a href="http://www.dreamsonthefly.com/allflyinfo.html"Steelhead Flies</a>
<a href="http://www.dreamsonthefly.com/troutflies.html">Trout Flies</a>
<a href="http://www.dreamsonthefly.com/atlanticsalmonflies.html">Beautiful Atlantic Salmon Flies</a>
</div>


<div id="OurGuides" class="submenustyle">
<a href="http://www.dreamsonthefly.com/newguides.html">About Dave Tucker</a>
<a href="http://www.dreamsonthefly.com/newguides.html">About Rhonda Price</a>
<a href="http://www.dreamsonthefly.com/newguides.html">About John Schaeffer</a>
<a href="http://www.dreamsonthefly.com/newguides.html">About Zach Mayhew</a>
<a href="http://www.dreamsonthefly.com/newguides.html">About our camp crew</a>
</div>

<div id="CorporateTrips" class="submenustyle">
<a href="http://www.dreamsonthefly.com/corporatepackages.html">Team Building</a>
<a href="http://www.dreamsonthefly.com/corporatepackages.html">Customer Incentives</a>
<a href="http://www.dreamsonthefly.com/corporatepackages.html">Employee Incentives</a>
</div>

<div id="Education" class="submenustyle">
<a href="http://www.dreamsonthefly.com/education.html">Knots</a>
<a href="http://www.dreamsonthefly.com/education.html">The Great Release</a>
<a href="http://www.dreamsonthefly.com/education.html">Ettiquite on the Water</a>
</div>

<div id="Blog" class="submenustyle">
<a href="http://dreamsonthefly.blogspot.com">Where are We, What are We Doing?</a>
</div>

<div id="ContactUs" class="submenustyle">
<a href="http://www.dreamsonthefly.com/comments.html">Contact Us</a>
<a href="http://www.dreamsonthefly.com/comments.html">Guest Book</a>
<a href="http://www.dreamsonthefly.com/comments.html">Sign Up for Our Newsletter</a>
</div>

<div id="TripPlanning" class="submenustyle">
<a href="http://www.travelstoremaker.com/cgit/porch?agentid=dreamsonthefly">Easy Airline Reservations </a>
<a href="http://www.flybook.com/">Make Your Guide Reservations Here</a>
<a href="http://www.dreamsonthefly.com/">What You Need to Bring</a>
</div>

still does not work, I may try to look to morrow

[winndknot]

got it solved.