The main menu items need to direct the user on a page of the current selected main menu item ,then show it's respective drop menu items.
here the structure of my html <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Untitled Document</title>
like the following example http://www.projectseven.com/support/index.htm.
The main menu items need to direct the user on a page of the current selected main menu item ,then show it's respective drop menu items.
here the structure of my html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
<script type="text/javascript" src="_js/jquery-1.3.2.min.js"></script>
script type="text/javascript">
</script>
</head>
<body >
<div class="menu_wrapper">
<ul class ="mainmenu" id='campaign'>
<li id="indexlink"><a href="http://localhost/test3/index/index" id="MainNav_0" rel="subcontent1" >Home</a>
<div class="defaultSubNav" id="subcontent1" ></div>
</li>
<li class='nav_seperator'></li>
<li id='Eventlink'>
<a href="http://localhost/test3/Event/index" id="MainNav_1" rel="subcontent">Event</a>
<div id="subcontent" class="defaultSubNav">
<ul class="SubItems" >
<li class="Subnav_Event" >
<a href="http://localhost/test3/Event/index" ><img src="images/NewMenu/Event_off.png" width='64' height='53'/></a>
<p><a href='http://localhost/test3/Event/index'>Event</a></p>
</li>
<li class="Subnav_target">
<a href="http://localhost/test3/Location/index" ><img src="images/NewMenu/Location_off.png" width='64' height='53'/></a>
<p><a href='http://localhost/test3/Location/index'>Location</a></p>
</li>
</ul>
</div>
</li>
<li class='nav_seperator'></li>
<li id="Associationlink">
<a href="http://localhost/test3/Association/index" id="MainNav_2" rel="SubmenuNav_2">Association</a>
<div id="SubmenuNav_2" class="defaultSubNav" >
<ul class='SubItems' >
<li>
<a href="http://localhost/test3/Association/index"><img src="images/NewMenu/Association_off.png" width='64' height='53'/></a>
<p><a href="#">Association</a></p>
</li>
<li><a href="http://localhost/test3/report/index" ><img src="images/NewMenu/Reports_off.png" width='64' height='53'/></a>
<p><a href='http://localhost/test3/report/index'>DATABASE</a></p>
</li>
</ul> </div>
</li>
</ul>
</div>
</body>
</html>
Thank you for ur help :)