Jump to content

Javascript drop down menus

Zer0Cam

By Zer0Cam
in Javascript Help

 Share

Recommended Posts

Zer0Cam Member

Zer0Cam

Posted
Posted

Ok, Guys this has stumped me I have a website I built for a teacher using drop down menus, I recently replaced the javascript so that it now works with Mozzila and IE 7.0 but it does not work with IE 6.0 is there a javascript that makes it work with all browsers? it's starting to get annoying heres the code I used.

 

<script language="javascript">
<!--
sfHover = function() {
var sfEls = document.getElementsByTagName("li");
for (var i=0; i<sfEls.length; i++) {
	sfEls[i].onmouseover=function() {
		this.className+=" sfhover";
	}
	sfEls[i].onmouseout=function() {
		this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
	}
}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);

-->
</script>

 

Website HTML

 

<?xml version="1.0" encoding="iso-8859-1"?><!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>Dr. Conway's Home Page</title>
<style type="text/css">
<!--
body,td,th {
color: #FFFFFF;
}

#side, #side ul {
padding: 0;
margin: 0;
list-style: none;
}

#side a {
display: block;
width: 10em;
}

#side li {
float: left;
width: 10em;
}

#side li ul {
position: absolute;
width: 10em;
left: -999em;
background: #ff0;
}

#side li ul a:hover {
background: #00F;
}

#side li:hover ul {
left: 6%;
}







#topbar, #topbar ul {
padding: 0;
margin: 0;
list-style: none;
}

#topbar a {
display: block;
width: 10em;
}

#topbar li {
float: left;
width: 10em;
}

#topbar li ul {
position: absolute;
width: 10em;
left: -999em;
background: #000000;
}

#topbar li ul a:hover {
background: #ffffff;
}

#topbar table li:hover ul {
left: auto;
}

-->
</style>

<script language="javascript">
<!--
sfHover = function() {
var sfEls = document.getElementsByTagName("li");
for (var i=0; i<sfEls.length; i++) {
	sfEls[i].onmouseover=function() {
		this.className+=" sfhover";
	}
	sfEls[i].onmouseout=function() {
		this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
	}
}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);

-->
</script>
</head>

<body bgcolor="black" text="#FFFFFF" link="#0000FF" vlink="#FFFF00" alink="#0000FF">
<table width="100%" height="370" cellpadding="6" cellspacing="6" id="topbar">
  <tr>

		<td bgcolor="blue" colspan="2">
			<h1>
        <p align="center">The Conway Home Page</p>
      </h1>

      <table width="100%" bordercolor="#000000" id="topbar">
        <tr>
						<td align="left">
							<ul>


              <li><a href="Apushindexmain.html"><font color="#FFFFFF">APUSH</a> 
                <ul>
                  <li><a href="Apushindexmain.html">Main Page</a></li>
                  <li><a href="Apushannouncements.html">Current Announcements</a></li>
                  <li><a href="Apushintroduction.html">Intro. & Orientation</a></li>
                  <li><a href="Conceptcardintroapush.html">Concept Cards</a></li>

                  <li><a href="Apushlinks.html">Links</a></li>
                  <li><a href="Apushsyllabusbasic.html">Course Syllabus</a></li>
                  <li><a href="Previousresultsdata.html">Previous Years Results</a></li>
                </ul>
								</li>
							</ul>
						</td>

						<td align="left">
							<ul>
								<li><a href="Globalindexmain.html"><font color="#FFFFFF">Global Studies</a> 

                <ul>
                  <li><a href="Globalindexmain.html">Main Page</a></li>
                  <li><a href="Globalannouncements.html">Current Announcements</a></li>
                  <li><a href="Globalintro&orientation.html">Intro. & Orientation</a></li>

                  <li><a href="Globalcoursepolicies.html">Course Policies</a></li>
                  <li><a href="Regional&thematiclinksmain.html">Regional & Thematic 
                    Links</a></li>
                </ul>
								</li>
							</ul>
						</td>
						<td align="left">

							<ul>

              <li><a href="Americanindexmain.html"><font color="#FFFFFF">American Studies</a> 
                <ul>
                  <li><a href="Americanindexmain.html">Main Page</a></li>
                  <li><a href="Americanannouncements.html">Current Announcements</a></li>
                  <li><a href="Americanintro&orientation.html">Intro. & Orientation</a></li>
                  <li><a href="Americancoursepolicies.html">Course Policies</a></li>

                  <li><a href="Americancontentlinks.html">Content Links</a></li>
                </ul>
								</li>
							</ul>
						</td>
						<td align="left">
							<ul>
								<li><a href="Methodsindexmain.html"><font color="#FFFFFF">Teaching Methods</a> 

                <ul>

                  <li><a href="Methodsindexmain.html">Main Page</a></li>
                  <li><a href="Instructionalstrategies.html">Instructional Strategies</a></li>
                  <li><a href="Projectbasedlearningmain.html">Project Based Learning</a></li>
                  <li><a href="Methodscourseindexmain.html">Methods Course</a></li>
                  <li><a href="Methodscoursesyllabusintro.html">Intro. & Orientation</a></li>
                  <li><a href="Methodscoursepolicies.html">Course Policies</a></li>

                  <li><a href="Methodslinks.html">Links</a></li>
                </ul>
								</li>
							</ul>
						</td>
						<td align="left">
							<ul>
								<li><a href="Webresourcesindexmain.html"><font color="#FFFFFF">Web Resources</a>  

                <ul>

                  <li><a href="Webresourcesindexmain.html">Main Page</a></li>
                  <li><a href="Webteacherresources.html">Teacher Resources</a></li>
                  <li><a href="Websocialstudiesresources.html">Social Studies 
                    Resources</a></li>
                  <li><a href="Webmediaresources.html">Media Resources</a></li>
                  <li><a href="Websearchengines.html">Search Engines</a></li>
                  <li><a href="Webtextbookresources.html">Textbook Links</a></li>

                </ul>
								</li>
							</ul>
						</td>
						<td align="left">
							<ul>
								<li><a href="Chslinksindexmain.html"><font color="#FFFFFF">CHS links</a> 

                <ul>
                  <li><a href="Chslinksindexmain.html">Main Page</a></li>

                </ul>
								</li>
							</ul>
						</td>
					</tr>
				</table>
			</td>
		</tr>
<tr>

   <td width="19%" height="209" align="left" valign="top" bgcolor="red"> 
      <ul id="side">
        <li> 

          <p> </p>
        </li>
        


	<li>
     <p><a href="index.html">Home</a></p>


	</li>
        <li> 		     
        </li>

        <li> 
          <p><a href="#">Parents</a></p>
          <ul>
            <li><a href="Apushindexmain.html">APUSH</a></li>
            <li><a href="Globalindexmain.html">Global Studies</a></li>
            <li><a href="Americanindexmain.html">American Studies</a></li>
          </ul>

        </li>
        <li> 
          <p><a href="#">Teachers</a></p>
          <ul>
            <li><a href="Methodsindexmain.html">Teaching Methods</a></li>
            <li><a href="Webresourcesindexmain.html">Web Resources</a></li>
            <li><a href="Chslinksindexmain.html">CHS Links</a></li>

          </ul>
        <li> 
          <p><a href="#">Students</a></p>
          <ul>
            <li><a href="Apushindexmain.html">APUSH</a></li>
            <li><a href="Globalindexmain.html">Global Studies</a></li>
            <li><a href="Americanindexmain.html">American Studies</a></li>

            <li><a href="Webresourcesindexmain.html">Web Resources</a></li>
            <li><a href="Chslinksindexmain.html">CHS Links</a></li>
          </ul>
      </ul>
</li>
</ul>
</td>
    <td width="81%" nowrap="nowrap"> 
      <p><font size="+4"><strong>Welcome to Dr. Conway's Home Page</strong></font></p>

      <p> </p>
      <p> </p>
      <p> </p>
      <p><strong><font size="+3"><br />
        Navigation for this site functions best with <br />
        Firefox or Safari (see menus provided above). <br />
        <br />
        In addition to the navigation menus, here are <br />

        links to a few of the most frequently visited pages...</font><font size="+2"><br />
        </font></strong></p>
      <p><strong><font size="+2"><a href="Apushindexmain.html">APUSH Main Class 
        Page</a></font></strong></p>
      <p><strong><font size="+2"><a href="Instructionalstrategies.html">Instructional 
        Strategies (for teachers) Page</a></font></strong></p>
      <p><strong><font size="+2"><a href="Americancontentlinks.html">Conway's 
        U.S. History Links </a>: listed in chronological order</font></strong></p>
      <p><strong><font size="+2"><a href="Instructionalsonglist.html">Songs & 
        Lyrics related to U.S. History: </a><b><strong><font size="+3"> <font size="+1">Conway's 
        annotated, chronological listings</font></font></strong></b></font></strong></p>

      <p><font size="+2"><strong>Dorky top 10 Lists</strong>: <a href="Dorkytoptenlists.html"><font size="+1"><strong>Conway's 
        Dorky Lists...</strong></font></a><strong><font size="+1"><a href="Dorkytoptenlistsb.html">Students, 
        Friends, & Family Dorky Lists</a></font></strong></font></p>
      <p><font size="+2"><strong><strong><a href="Resume.html">Resume</a></strong></strong></font></p>
      <p></FONT></A></P>
      <!-- InstanceEndEditable --></td>
  </tr>

  <!-- InstanceEndRepeatEntry --><!-- InstanceEndRepeat -->
</table>
<table width="97%" border="0">
  <tr>
    <td><!-- InstanceBeginEditable name="Footnote" --> <P ali 
      <P align="center"><B>This web site contains information for Dr. Grant Conway's 
        classes at<br />
        <BR>
        </B><A HREF="http://www.chs.lane.edu/"><B>Winston Churchill High School</B></A><B> 
        and the </B><A HREF="http://www.uoregon.edu/"><B>University of Oregon</B></A><B>. 
        </B></P><P ali
      <P align="center"><a href="http://www.chs.lane.edu/"><b><img src="images/CHSimage%20again.jpg" width="158" height="61" /></b></a></P>

      <P align="center"><BR>
        <B><I>(last update = 6/ 28/ 2007)<BR>
        </I></B></P>
      <P ali
      <P align="center"><A HREF="mailto:conway@4j.lane.edu"><IMG SRC="images/mailslot.gif" WIDTH=36 HEIGHT=20 BORDER=0 ALIGN=bottom hspace=10></A><B> 
        Comments and questions can be sent to: <B>conway@4j.lane.edu</B></FONT></P>
      <!-- InstanceEndEditable --></td>
  </tr>
</table>

</body>
<!-- InstanceEnd --></html>

Link to comment
https://forums.phpfreaks.com/topic/66954-javascript-drop-down-menus/
Share on other sites
This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to topic listing
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.