Switch Menu not displaying in all browsers

[kmpanda915]

1) Script Title: Switch Menu

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...switchmenu.htm

3) Describe problem: I have created a website for our school (www.stmaryses.org) which uses the Swith Menu code. It displays beautifully in Internet Explorer. It displays all 5 menus correctly, but when opened in FireFox, Safari, or Google Chrome, it only displays the first menu, and you have to click the first menu to open the second one and so on and so forth. How do I fix this so it can open properly in other browsers?

[vwphillips]

the switch menu displays correctly on the demo page using firefox

so you will need to post a link to your problem page

[kmpanda915]

How did you view a demo page?

The website: www.stmaryses.org doesn't display properly on Safari, Google Chrome and Fire Fox, it is supposed to have 5 boxes showing all the time that drop down revealing other links when you click on it. At school I have Fire Fox and Internet Explorer downloaded and it never comes up right in any other browser.

[vwphillips]

for the flying text use

<div id="fly" style="color:#006633;font-Size:20px;font-Family:tahoma;">"An education that reveals Christ."</div>
<script type="text/javascript">
//Flying Letters script- by Matthias (info@freejavascripts.f2s.com)
// Modified by Twey for efficiency and compatibility
//For this script and more, visit Dynamic Drive: http://www.dynamicdrive.com

//Configure message to display. Use "$" for linebreak
//By default, set to just grab the text from element with ID="fly"
message = document.getElementById("fly").innerHTML; // $ = taking a new line
distance = 70; // pixel(s)
speed = 150; // milliseconds

var txt="",
	num=0,
	num4=0,
	flyofle="",
	flyofwi="",
	flyofto="",
	fly=document.getElementById("fly");


function stfly() {
	for(i=0;i != message.length;i++) {
		if(message.charAt(i) != "$")
			txt += "<span style='position:relative;visibility:hidden;' id='n"+i+"'>"+message.charAt(i)+"<\/span>";
		else
			txt += "<br>";
	}
	fly.innerHTML = txt;
	txt = "";
	flyofle = fly.offsetLeft;
	flyofwi = fly.offsetWidth;
	flyofto = fly.offsetTop;
	fly2b();
}

function fly2b() {
	if(num4 != message.length) {
		if(message.charAt(num4) != "$") {
			var then = document.getElementById("n" + num4);
			then.style.left = flyofle - then.offsetLeft + flyofwi / 2;
			then.style.top = flyofto - then.offsetTop + distance;
			fly3(then.id, parseInt(then.style.left), parseInt(then.style.left) / 5, parseInt(then.style.top), parseInt(then.style.top) / 5);
		}
		num4++;
		setTimeout("fly2b()", speed);
	}
}

function fly3(target,lef2,num2,top2,num3) {
	if((Math.floor(top2) != 0 && Math.floor(top2) != -1) || (Math.floor(lef2) != 0 && Math.floor(lef2) != -1)) {
		if(lef2 >= 0)
			lef2 -= num2;
		else
			lef2 += num2 * -1;
		if(Math.floor(lef2) != -1) {
			document.getElementById(target).style.visibility = "visible";
			document.getElementById(target).style.left = Math.floor(lef2);
		} else {
			document.getElementById(target).style.visibility = "visible";
			document.getElementById(target).style.left = Math.floor(lef2 + 1);
		}
		if(lef2 >= 0)
			top2 -= num3
		else
			top2 += num3 * -1;
		if(Math.floor(top2) != -1)
			document.getElementById(target).style.top = Math.floor(top2);
		else
			document.getElementById(target).style.top = Math.floor(top2 + 1);
		setTimeout("fly3('"+target+"',"+lef2+","+num2+","+top2+","+num3+")",50)
	}
}

stfly()

</script>

for the switch menu use
css

.menutitle {
cursor:pointer;
margin-bottom: 5px;
color:white;
width:140px;
padding:2px;
text-align:center;
font-weight:bold;
background-color:#006633;
  font-family:CENTURY GOTHIC;font-size:18px
}

submenu {
  font-family:CENTURY GOTHIC;font-size:12pxcolor:black;font-Weight:bold;
margin-bottom: 0.5em;
}

html

<div id="masterdiv">



	<div class="menutitle" onclick="SwitchMenu('sub1')">About St. Mary's Elementary School</div>
<span class="submenu" id="sub1">

		<a href="index.html">Home</a><br>

		<a href="history1.html">History</a><br>
		<a href="staff.html">Staff</a><br>
		<a href="honor.html">Honor Roll</a><br>
		<a href="pre.html">Preschool Brochure</a><br>
		<a href="brochure.html">School Brochure</a><br>
		<a href="afterschool.html">Afterschool Program</a><br>

		<a href="student.html">Student Council</a><br>
		<a href="pto.html">PTO Corner</a><br>
		<a href="links.html">Links</a><br>
		<a href="contact.html">Contact Us</a><br>

	</span>

<div class="menutitle" onclick="SwitchMenu('sub2')">Important Information</div>
	<span class="submenu" id="sub2">
			<a href="month.html">Calendar</a><br>
		<a href="lunch.html">Lunch Menu</a><br>
		<a href="handbook.html">Handbook</a><br>

		<a href="phandbook.html">Preschool Handbook</A><br>
		<a href="bullying.html">Bullying Information</A><br>
		<a href ="curr.html">Short Curriculums</A><br>
		<a href="events.html">Events</a><br>
		<a href ="acal.html">2011-2012 Academic Calendar</a><br>
		<a href="school.html">2011-2012 School Calendar</a><br>




</span>

	<div class="menutitle" onclick="SwitchMenu('sub3')">Teacher/Class Pages</div>

	<span class="submenu" id="sub3">

	<A HREF ="main.html">Office and Nurse</A><br>
	<A HREF ="yellowhouse.html">Preschool</A><br>
	<A HREF ="specials.html">Specials</A><br>
	<A HREF ="other.html">Title I and <BR>
	Remedial Math and Reading<br>
	<A HREF ="firstfloor.html">First Floor - Gr. K-2</A><br>

	<A HREF ="secondfloor.html">Second Floor - Gr. 3-5</A><br>
	<A HREF ="thirdfloor.html">Third Floor - Gr. 6-8</A><br>


</span>




	<div class="menutitle" onclick="SwitchMenu('sub4')">Tuition</div>


	<span class="submenu" id="sub4">
		<a href="tuition.html">Tuition</a><br>
		<a href="financial.html">Financial Aid</a><br>
		<a href="registration.html">Registration</a><br>

		<a href ="https://eps.mvpbanking.com/cgi-bin/efs/login.pl?access=55311">e-Funds for School</A><br>
 		<a href="http://www.factsmgt.com">FACTS Tuition Management</a><br>

</span>







	<div class="menutitle" onclick="SwitchMenu('sub5')">Other</div>
<span class="submenu" id="sub5">
		<a href="scrip.html">Scrip Card Program</a><br>
		<a href="fund.html">Ongoing Fundraisers</a><br>
		<a href="pictures.html">Fantastic Photos</a><br>

		<a href="uniform.html">Uniform Ordering</a><br>
		<a href="wish.html">Wish List</a><br>
		<a href="library.html">Library Book Donation Program</a><br>
		<a href="big.html">Big Y Homework Help</A></br>

	</span>

</div>

[kmpanda915]

Got it figured out. Thank you!