Menu Works in Mozilla but doesn't work in IE

2 New Member

Hi,

Can anybody please help me with this problem.
In my application, I'm using Menus. and the CSS for the menu is as given below

ccMenu.css

Expand|Select|Wrap|Line Numbers

 /* Root = Horizontal, Secondary = Vertical */

ul#navmenu {

  margin: 0;

  border: 0 none;

  padding: 0;

  /*width changed from 500px to 600px*/

  width: 500px; /*For KHTML*/

  list-style: none;

  height: 24px;

}
 
ul#navmenu li {

  margin: 0;

  border: 0 none;

  padding: 0;

  float: left; /*For Gecko*/

  display: inline;

  list-style: none;

  position: relative;

  height: 24px;

}
 
ul#navmenu ul {

  margin: 0;

  border: 0 none;

  padding: 0;

  width: 160px;

  list-style: none;

  display: none;

  position: absolute;

  top: 24px;

  left: 0;

}
 
ul#navmenu ul li {

  float: none; /*For Gecko*/

  display: block !important;

  display: inline; /*For IE*/

}
 
/* Root Menu */

ul#navmenu a {

  border: 1px solid #FFF;

  border-right-color: #CCC;

  border-bottom-color: #CCC;

  padding: 0 6px;

  float: none !important; /*For Opera*/

  float: left; /*For IE*/

  display: block;

  background: #EEE;

  color: #666;

  font: bold 12px/22px Verdana, Arial, Helvetica, sans-serif;

  text-decoration: none;

  height: auto !important;

  height: 1%; /*For IE*/

}
 
/* Root Menu Hover Persistence */

ul#navmenu a:hover,

ul#navmenu li:hover a,

ul#navmenu li.iehover a {

  background: #CCC;

  color: #FFF;

}
 
/* 2nd Menu */

ul#navmenu li:hover li a,

ul#navmenu li.iehover li a {

  float: none;

  background: #EEE;

  color: #666;

}
 
/* 2nd Menu Hover Persistence */

ul#navmenu li:hover li a:hover,

ul#navmenu li:hover li:hover a,

ul#navmenu li.iehover li a:hover,

ul#navmenu li.iehover li.iehover a {

  background: #CCC;

  color: #FFF;

}
 
/* 3rd Menu */

ul#navmenu li:hover li:hover li a,

ul#navmenu li.iehover li.iehover li a {

  background: #EEE;

  color: #666;

}
 
/* 3rd Menu Hover Persistence */

ul#navmenu li:hover li:hover li a:hover,

ul#navmenu li:hover li:hover li:hover a,

ul#navmenu li.iehover li.iehover li a:hover,

ul#navmenu li.iehover li.iehover li.iehover a {

  background: #CCC;

  color: #FFF;

}
 
/* 4th Menu */

ul#navmenu li:hover li:hover li:hover li a,

ul#navmenu li.iehover li.iehover li.iehover li a {

  background: #EEE;

  color: #666;

}
 
/* 4th Menu Hover */

ul#navmenu li:hover li:hover li:hover li a:hover,

ul#navmenu li.iehover li.iehover li.iehover li a:hover {

  background: #CCC;

  color: #FFF;

}
 
ul#navmenu ul ul,

ul#navmenu ul ul ul {

  display: none;

  position: absolute;

  top: 0;

  left: 160px;

}
 
/* Do Not Move - Must Come Before display:block for Gecko */

ul#navmenu li:hover ul ul,

ul#navmenu li:hover ul ul ul,

ul#navmenu li.iehover ul ul,

ul#navmenu li.iehover ul ul ul {

  display: none;

}
 
ul#navmenu li:hover ul,

ul#navmenu ul li:hover ul,

ul#navmenu ul ul li:hover ul,

ul#navmenu li.iehover ul,

ul#navmenu ul li.iehover ul,

ul#navmenu ul ul li.iehover ul {

  display: block;

}

the same CSS works in Mozlla but doesn't work on IE.

my jsp page is like this

linksMenu.jsp

Expand|Select|Wrap|Line Numbers

 <html>

<head>

    <title>Child Tracking System</title>

        <script src="js/links.js" type = "text/javascript"></script>
 
       <link href="css/style.css" rel="stylesheet" type="text/css">

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

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

        <link href="css/egovModified.css" rel="stylesheet" type="text/css">
 
         <jsp:include page="authenticate.jsp" />
 
</head>
 
<body onload='getDistricts();' id="bodyArea" style="background-image: url('img/sides_body_wide.gif'); background-color:'#666';background-attachment: fixed; width: 100%; background-position: center top; overflow-x: hidden;">
 
<!--------- START HEADER --------> 

            <jsp:include page="incl/header.jsp" />

<!--------- END HEADER -------->             
 
<td>
 
<Center>

<table align="center" width="90%">

<form name="links"  method="get"  target="_self">

<center>
 
<table width="1002px" align="justify" style="background-color: transparent; font color="#9933ff""  border="0" cellpadding="0" cellspacing="5" >
 
<table align="center" border="0" cellpadding="1" cellspacing="0" width="743">

<tr>

<td align="justify" width="100%"> &nbsp;     

District: 

<select class="style01" id=district name="district" onchange='getBlock("block"); clearTable();' 

style=" width: 50mm;font-family: Georgia; border-style: double" size="1" tabindex="1" width="40" >

</select>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp
 
Block:&nbsp; 

<select class="style01"  id=block name="block" 

onchange=' getCluster("cluster");clearTable();' 

style="width: 80mm;font-family: Georgia; border-style: double" size="1" tabindex="2" >

<option value="0">Select Block</option>

</select>

</td>

</tr>

</table>
 
<table align="center" border="0" cellpadding="1" cellspacing="0" width="743" >

<tr>

<td align="left" width="100%" >

&nbsp;&nbsp;Cluster:

<select class="style01" id=cluster name="cluster"  

onchange=' getSchool("school");clearTable();' 

style="width: 80mm; font-family: Georgia; border-style: double; padding: 0" size="1" tabindex="3">

<option value="0">Select Cluster</option>

</select>&nbsp;&nbsp;&nbsp; 

School:

<select class="style01" id=mySchool name="mySchool" onchange='clearTable();' 

style="width: 80mm; font-family: Georgia; border-style: double" size="1" tabindex="4"> 

<option value="0">Select School</option>

</select>

</td>

</tr>

</table>

</table>
 
</form>
 
<form name="menulinks" action="login/loginmenu.do" method="get" target="_self">
 
<table width=850px align="center" style="background-color: transparent;" border="0" cellpadding="0" cellspacing="0"> 

<tr>

<td>

<!-- Tab Navigation Begins -->

<center>  
 
  <ul  id="navmenu" align="right" style="width: 1000px; " >
 
  <li><a  style="cursor: pointer " target="_top" title="Create Codes">Codes</a>

        <ul>

                 <li><a style="cursor: pointer " onClick="showTable(this.id)"    

                       id="createcode">Create Codes</a></li>

                <li ><a style="cursor: pointer " onClick="showTable(this.id)" 

                        id="viewcode">View Codes</a></li>

           </ul>

  </li>
 
  <li ><a  style="cursor: pointer " target="_top" title="Create or view/Edit 

                                                                              Blocks">Blocks</a>

          <ul>

                 <li ><a style="cursor: pointer " onClick="showTable(this.id)" 

                          id="createblock">Create</a></li>

                 <li ><a style="cursor: pointer " onClick="showTable(this.id)" 

                         id="viewblock">View/Edit</a></li>

           </ul>

  </li>
 
 <li ><a style="cursor: pointer " target="_top" title="Create or view/Edit 

                                                                            Clusters">Clusters</a>

          <ul>

                 <li ><a style="cursor: pointer " onClick="showTable(this.id)" 

                          id="createcluster">Create</a></li>

                 <li ><a style="cursor: pointer " onClick="showTable(this.id)" 

                          id="viewcluster">View/Edit</a></li>

           </ul>

  </li>
 
   <li ><a style="cursor: pointer " title="Create or view/Edit 

                                                                           Schools">Schools</a>

          <ul>

               <li ><a style="cursor: pointer " onClick="showTable(this.id)" 

                       id="createschool">Create</a></li>

               <li ><a style="cursor: pointer " onClick="showTable(this.id)" 

                       id="viewschool">View/Edit</a></li>

           </ul>

    </li>
 
     <li ><a style="cursor: pointer " target="_top" title="Create or view/Edit 

                                                                             Classes">Classes</a>

             <ul>

                    <li "><a style="cursor: pointer " onClick="showTable(this.id)" 

                              id="createclass">Create</a></li>

                    <li ><a style="cursor: pointer " onClick="showTable(this.id)" 

                             id="viewclass">View/Edit</a></li> 

            </ul>

     </li>
 
     <li ><a style="cursor: pointer " target="_top" title="Create or view/Edit 

                                                                           Sections">Sections</a>

             <ul>

                    <li ><a style="cursor: pointer " onClick="showTable(this.id)" 

                            id="createsection">Create</a></li>

                   <li ><a style="cursor: pointer " onClick="showTable(this.id)" 

                           id="viewsection">View/Edit</a></li> 

            </ul>

     </li>
 
   <li ><a style="cursor: pointer " target="_top" title="Create or view/Edit 

                                                                           Teachers">Teachers</a>

        <ul>

               <li ><a style="cursor: pointer " onClick="showTable(this.id)" 

                        id="createteacher">Create</a></li>

               <li "><a style="cursor: pointer " onClick="showTable(this.id)" 

                         id="viewteacher">View/Edit</a></li>

           </ul>

  </li>
 
  <li ><a style="cursor: pointer " target="_top" title="Create or view/Edit 

                                                                           Students">Students</a>

          <ul>

               <li ><a style="cursor: pointer " onClick="showTable(this.id)" 

                        id="createstudent">Create</a></li>

               <li ><a style="cursor: pointer " onClick="showTable(this.id);" 

                         id="viewstudent">View/Edit</a></li>

           </ul>

  </li>
 
    <li ><a  style="cursor: no-drop;  background-color: transparent; font 

                                           color="#9933ff"" target="_top">Assessment</a>

    </li> 
 
</ul>
 
</center>

<!-- Tab Navigation Ends -->
 
<script language='JavaScript'>
 
function getDistricts()

{
 
--------------------Java Code---------------------
 
}

</script>

</table> 

</table>

</form>

</body>

</html>

Dec 4 '07 #1

Subscribe Reply

3513

drhowarddrfine

7,435

Recognized Expert Expert

In modern browsers, you can use 'hover' on any element but IE is not a modern browser and fails when hover is applied to anything but <a>.

Dec 4 '07 #2

namratha247

New Member

In modern browsers, you can use 'hover' on any element but IE is not a modern browser and fails when hover is applied to anything but <a>.

Ok. I did not know that.

Thanks a lot.

Dec 5 '07 #3

Similar topics

4756

Replace Contextmenu with new menu

by: DJ WIce | last post by:

Hi all, I did make a script/css thing to replace the contextmenu on the website with a new one: http://www.djwice.com/contextmenu.html It works nice in MSIE, but on Netscape (and probable other browsers) it stays on the same place (does not "open'' where the mouse is). And the links do not work when you click on them. If anyone has sugestions on how to improve it, please let me know.

Javascript

3850

javascript toolbar-menu problem

by: JesusFreak | last post by:

From: us_traveller@yahoo.com (JesusFreak) Newsgroups: microsoft.public.scripting.jscript Subject: toolbar script problem NNTP-Posting-Host: 192.92.126.136 Recently, I downloaded the following beautiful script "http://javascript.internet.com/navigation/toolbar-menu.html". It works like a charm. I made my webpage in frames, where the nav-frame shows the menubar, so whenever I click a link in the menubar, it opens in the frame below. But...

Javascript

4344

slide menu how to make it relative to table

by: ajay | last post by:

I have following code for a slide menu but i twiked it to work for a single level menu. Open it in a Browser to get a clear picture. I have 2 Qs 1) How to make first entry as non-link. i.e i want to make first text as Table Heading/menu category. For examle in the given menu i want to make a heading as "Comp. Languages" which won't be a link. 2) The position of this menu is absolute to the page. I want to make it absolute to the Table...

HTML / CSS

5770

Problem with IE6 & xhtml-strict <div> menu handling

by: Brian Idzik | last post by:

I've successfully setup a xhtml 1.0 strict page with Mozilla & Netscape to display links in a toolbar into an internal <div id='content'> within the same document. The toolbar uses some javascript, but mostly CSS class & id elements. Mozilla & Netscape work fine handling the toolbar submenus & contents, but IE6 misbehaves on several areas. On loading the page, the target div (id='content') will not display. When a menu item is...

HTML / CSS

11103

UL navigation menu, right aligned

by: Marek Mand | last post by:

How to create a functional *flexible* UL-menu list <div> <ul> <li><a href=""></li> <li><a href=""></li> <li><a href=""></li> </ul> </div> (working in IE, Mozilla1.6, Opera7 (or maybe even in Opera6))

HTML / CSS

1488

css menu doesn't work correctly in mozilla

by: TAZ | last post by:

Here http://jacek.jackowski.net.pl/kontakt.php is a css menu and also a form below, when the menu expands it hides part fo forms inputs. It'll be allright but when you move cursor above the form input menu lost its focus. What else when you write something in the form it could bee seen through the menu but it shouldn't because there is no opacity set. I'll be very thankfull for any help - it works in Opera and IE but not in mozilla and I...

HTML / CSS

2833

CSS Menu - comments and suggestions please

by: Thomas Mlynarczyk | last post by:

Hi, Could some kind person using Mac or Linux (or others) please take a look at http://www.mlynarczyk-webdesign.de/tmp/menu/menu.html and tell me if the page renders as it should (screenshot provided on the page)? Never mind the colors, this is just to test the functionality. The page validates (HTML & CSS), and seems to "work" as expected on Windows (IE5+, OP5+, NN5+, Mozilla & Firefox). I know the styles won't work on IE4

HTML / CSS

2989

Increasing size of Drop Down Menu

by: Bilal | last post by:

Hi, I've been looking all over the net for a way to increase the size of a drop down menu without any success. Does anyone perhaps have a way to display 11-15 items on a menu without having recourse to: 1. scroll bar. 2. configuring IE 3. decreasing the size of the font. Here is the code I used for my Drop down Menu: ______________ <select style="background-color: #FFFFFF; width:300;" size="1"

Javascript

2718

Unhandled Exception in ASP.NET 2 asp:Menu control

by: Chuck Hartman | last post by:

I have a Windows service that requests web pages from a site using an HttpWebRequest object. When I try to request a page from an ASP.NET 2 site, I get a WebException with message "The remote server returned an error: (500) Internal Server Error." I found a post that suggested to catch the WebException to retrieve the actual HttpWebResponse object for more information. The response returned is shown below. At first I thought this was a...

ASP.NET

9730

What is ONU?

by: marktang | last post by:

ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main usage, and What is the difference between ONU and Router. Let’s take a closer look ! Part I. Meaning of...

General

9605

Changing the language in Windows 10

by: Hystou | last post by:

Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...

Windows Server

10651

Problem With Comparison Operator <=> in G++

by: Oralloy | last post by:

Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...

C / C++

10392

Maximizing Business Potential: The Nexus of Website Design and Digital Marketing

by: jinu1996 | last post by:

In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth. The Art of Business Website Design Your website is...

Online Marketing

10136

Discussion: How does Zigbee compare with other wireless protocols in smart home applications?

by: tracyyun | last post by:

Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...

General

7671

Access Europe - Using VBA to create a class based on a table - Wed 1 May

by: isladogs | last post by:

The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...

Microsoft Access / VBA

6893

Couldn’t get equations in html when convert word .docx file to html file in C#.

by: conductexam | last post by:

I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert into image. Globals.ThisAddIn.Application.ActiveDocument.Select();...

C# / C Sharp

5693

Windows Forms - .Net 8.0

by: adsilva | last post by:

A Windows Forms form does not have the event Unload, like VB6. What one acts like?

Visual Basic .NET

3868

How to add payments to a PHP MySQL app.

by: muto222 | last post by:

How can i add a mobile payment intergratation into php mysql website.

PHP