div-programmering af undermenu
Hej.Jeg har et problem med en menu, som skal vises på den helt rigtige måde.
Det sted hvor jeg pt. har mulighed for at lægge siden ud, understøtter ikke include af asp-filer, så jeg har lavet et hurtigt testsite, så det kan ses, hvordan siden virker. http://www.rikkeogniels.dk/web/index2.asp
Problemet med menu’en, som den er nu, er, at når man fx fører musen over ”e-learning” og går ned og klikker på menupunktet ”multimedie”, så forsvinder undermenuen, når man kommer ind på den pågældende side. Det dur ikke! Undermenuen skal være synlig på siden fra start. Men samtidig skal det være sådan, at man stadig kan bruge mouse-over-effekten på de øvrige hovedmenu-punkter. Fx når man fører musen over ”Produkter”, skal man stadig få vist undermenupunkterne til produkter – og man skal kunne klikke på disse links. Men når man så fører musen væk fra det område igen (ned på hoved-tekstfeltet), skal det være e-learning-menuen, som er aktiv igen, fordi det er denne side, man er inde på.
Forklarer jeg det mon godt nok?
Det jeg leder efter er derfor et script (eller hvad det nu kaldes), som kan definere, at en bestemt undermenu skal være synlig fra start, men mouse-over-effekten skal ”overrule” denne menu – indtil musen føres væk igen.
Den øverste pil skal være aktiv over den side, der er aktiv (fx ”e-learning”), indtil musen føres over et af de andre menu-punkter (fx ”produkter”). Når musen føres væk fra menu-området skal pilen være synlig over den aktive side igen.
Det kode, jeg har indtil videre ser sådan ud. (Hver undermenu ligger som include):
FORSIDEN:
<ul>
<li><a href="index.asp" title="Til forsiden" onmouseover="expandcontent('sc0', this)"><img src="img/logo.gif" alt="Eductor" width="277" height="85" border="0" /></a></li>
<li><a href="underside.asp" onmouseover="expandcontent('sc1', this);MM_swapImage('Image6','','img/menu/1_over.gif',1)" onmouseout="MM_swapImgRestore()"><img src="img/menu/1.gif" alt="Produkter" name="Image6" width="85" height="85" border="0" id="Image6" /></a></li>
<li><a href="underside.asp" onmouseover="expandcontent('sc2', this);MM_swapImage('Image7','','img/menu/2_over.gif',1)" onmouseout="MM_swapImgRestore()""><img src="img/menu/2.gif" alt="Cases" name="Image7" width="53" height="85" border="0" id="Image7" /></a></li>
<li><a href="underside.asp" onmouseover="expandcontent('sc3', this);MM_swapImage('Image8','','img/menu/3_over.gif',1)" onmouseout="MM_swapImgRestore()""><img src="img/menu/3.gif" alt="Kompetencestyring" name="Image8" width="148" height="85" border="0" id="Image8" /></a></li>
<li><a href="underside.asp" onmouseover="expandcontent('sc4', this);MM_swapImage('Image9','','img/menu/4_over.gif',1)" onmouseout="MM_swapImgRestore()""><img src="img/menu/4.gif" alt="E-learning" name="Image9" width="89" height="85" border="0" id="Image9" /></a></li>
<li><a href="underside.asp" onmouseover="expandcontent('sc5', this);MM_swapImage('Image10','','img/menu/5_over.gif',1)" onmouseout="MM_swapImgRestore()""><img src="img/menu/5.gif" alt="Lovgivning" name="Image10" width="94" height="85" border="0" id="Image10" /></a></li>
<li><a href="underside.asp" onmouseover="expandcontent('sc6', this);MM_swapImage('Image11','','img/menu/6_over.gif',1)" onmouseout="MM_swapImgRestore()""><img src="img/menu/6.gif" alt="Om Eductor" name="Image11" width="96" height="85" border="0" id="Image11" /></a></li>
<li><a href="underside.asp" onmouseover="expandcontent('sc7', this);MM_swapImage('Image12','','img/menu/7_over.gif',1)" onmouseout="MM_swapImgRestore()""><img src="img/menu/7.gif" alt="Kontakt" name="Image12" width="58" height="85" border="0" id="Image12" /></a></li>
<li><img src="img/menu/slut.gif" width="20" height="85" alt="" /></li>
</ul>
UNDERSIDEN E-LEARNING – MULTIMEDIE:
<ul>
<li><a href="index.asp" title="Til forsiden" onmouseover="expandcontent('sc0', this)"><img src="img/logo.gif" alt="Eductor" width="277" height="85" border="0" /></a></li>
<li><a href="underside.asp" onmouseover="expandcontent('sc1', this);MM_swapImage('Image6','','img/menu/1_over.gif',1)" onmouseout="MM_swapImgRestore()"><img src="img/menu/1.gif" alt="Produkter" name="Image6" width="85" height="85" border="0" id="Image6" /></a></li>
<li><a href="underside.asp" onmouseover="expandcontent('sc2', this);MM_swapImage('Image7','','img/menu/2_over.gif',1)" onmouseout="MM_swapImgRestore()""><img src="img/menu/2.gif" alt="Cases" name="Image7" width="53" height="85" border="0" id="Image7" /></a></li>
<li><a href="underside.asp" onmouseover="expandcontent('sc3', this);MM_swapImage('Image8','','img/menu/3_over.gif',1)" onmouseout="MM_swapImgRestore()""><img src="img/menu/3.gif" alt="Kompetencestyring" name="Image8" width="148" height="85" border="0" id="Image8" /></a></li>
<li><a href="underside.asp" onmouseover="expandcontent('sc4', this)"><img src="img/menu/4_over.gif" alt="E-learning" name="Image9" width="89" height="85" border="0" id="Image9" /></a></li>
<li><a href="underside.asp" onmouseover="expandcontent('sc5', this);MM_swapImage('Image10','','img/menu/5_over.gif',1)" onmouseout="MM_swapImgRestore()""><img src="img/menu/5.gif" alt="Lovgivning" name="Image10" width="94" height="85" border="0" id="Image10" /></a></li>
<li><a href="underside.asp" onmouseover="expandcontent('sc6', this);MM_swapImage('Image11','','img/menu/6_over.gif',1)" onmouseout="MM_swapImgRestore()""><img src="img/menu/6.gif" alt="Om Eductor" name="Image11" width="96" height="85" border="0" id="Image11" /></a></li>
<li><a href="underside.asp" onmouseover="expandcontent('sc7', this);MM_swapImage('Image12','','img/menu/7_over.gif',1)" onmouseout="MM_swapImgRestore()""><img src="img/menu/7.gif" alt="Kontakt" name="Image12" width="58" height="85" border="0" id="Image12" /></a></li>
<li><img src="img/menu/slut.gif" width="20" height="85" alt="" /></li>
</ul>
MENUEN:
<div id="tabcontentcontainer">
<div id="sc0"></div>
<div id="sc1"><!--#include file="include/drop_menu1.asp"--></div>
<div id="sc2"><!--#include file="include/drop_menu2.asp"--></div>
<div id="sc3"><!--#include file="include/drop_menu3.asp"--></div>
<div id="sc4"><!--#include file="include/drop_menu4.asp"--></div>
<div id="sc5"><!--#include file="include/drop_menu5.asp"--></div>
<div id="sc6"><!--#include file="include/drop_menu6.asp"--></div>
<div id="sc7"><!--#include file="include/drop_menu7.asp"--></div>
</div>
Håber at nogen kan hjælpe mig videre.
I øvrigt aner jeg ikke, om dette er en nem eller svær opgave, så giv lige lyd, hvis der skal andet end point på bordet.
Venlig hilsen fru_t
