Avatar billede Lasse Novice
31. januar 2004 - 20:32 Der er 7 kommentarer og
1 løsning

Vis nyt layer?

Jeg er igang med at lave en menu. Den er meget specifik, eftersom der kun er 2 niveau'er(hoved niveau og under niveau). Den skal vaere ligesom http://www.aspnetmenu.com/demo.aspx?id=2

Problemet med den er at der er ALT for meget Javascript kode, saa jeg har selv lavet en menu med en smaa 20 liniers javascript kode. Det sidste jeg mangler for at det bliver perfekt er at idet jeg viser undermenuen, saa skal den vises "topmost"(z-index = 999999) uden transperanthed. Det virker nogen gange - dog ikke altid - og af en eller anden grund, saa vises den som et layer med transperant baggrund - dvs. at man kan se det som er under undermenuen.... det bliver mikset sammen.

Hvordan goer jeg saaledes at den undermenu der vises har en hvid baggrund saa den ikke mikses sammen med baggrunden?
Avatar billede roenving Novice
31. januar 2004 - 20:36 #1
<style type="text/css">
.undermenu{
background:#fff;
border:0px;/*1px solid blue*/
</style>

<div class="undermenu">
Avatar billede Lasse Novice
31. januar 2004 - 20:48 #2
Er du sikker paa det... Det virker ihvert fald ikke med det der eller ogsaa goer jeg noget forkert!
Avatar billede roenving Novice
31. januar 2004 - 20:49 #3
Hvad gør du ?-)
Avatar billede Lasse Novice
31. januar 2004 - 20:55 #4
jeg kan vel ikke paste kode her vel? Jeg proever i hvert fald:

<HTML>
    <HEAD>
        <title>WebForm1</title>
        <STYLE>
    .MenuGroup { border-width:1px; border-style:solid; border-color:silver; cursor:hand; }
    .MenuItem { cursor:hand; }
    .undermenu{background:#fff;border:0px;}


        </STYLE>
        <SCRIPT>

var gSubElement;
var setTimeOutId=-1

function CalculateTop(element)
{
    var y=0;
   
    while(element!=document.body)
    {
        y+=element.offsetTop;
        element=element.offsetParent;
    };
   
    return y - 3;
};

function ExpandMainMenu(elementId, subElementId)
{
    if(setTimeOutId != -1) clearTimeout(setTimeOutId)
    setTimeOutId = setTimeout('InternalExpandMainMenu(\'' + elementId + '\',\'' + subElementId + '\')', 200)
}

function InternalExpandMainMenu(elementId, subElementId)
{
    setTimeOutId = -1;

    var element = elementId == '' ? undefined :document.getElementById(elementId)
    var subElement = subElementId == '' ? undefined : document.getElementById(subElementId)

    if(gSubElement != subElement)
    {
        if(gSubElement != undefined) {gSubElement.style.visibility = 'hidden';}

        if(subElement != undefined)
        {
            subElement.style.top = CalculateTop(element) + "px"

            subElement.style.visibility = 'visible'
            document.getElementById("subs").style.zIndex = 999
        }

        gSubElement = subElement
    }
}

function CollapseSubMenu(collapse)
{
    if(setTimeOutId != -1) clearTimeout(setTimeOutId)
    if(collapse == 'true') setTimeOutId = setTimeout('InternalCollapseSubMenu()', 200)
}

function InternalCollapseSubMenu()
{
    if(gSubElement != undefined) {gSubElement.style.visibility = 'hidden';}
    gSubElement = null
}

function ChangeBackground(element, color)
{
    element.style.backgroundColor = color
}
        </SCRIPT>
    </HEAD>
    <body MS_POSITIONING="GridLayout">
        <form name="Form1" method="post" action="WebForm1.aspx?id_attractions=14" id="Form1">
<input type="hidden" name="__VIEWSTATE" value="dDwtMTUxNTE0ODA3Mzs7Pkmdkp9uu0FMicSSPkJOwobGdf+I" />

            <div id="demoNav" style="width:190px;position:absolute;visibility:visible;top:0px;" ><table class="MenuGroup" cellspacing="1" width="100%" cellpadding="0" border="0" style="z-index:5;" onmouseout="CollapseSubMenu('true')">
<tr onMouseOver="ChangeBackground(this, '#cccccc')" onmouseout="ChangeBackground(this, 'white');" onclick="window.location.href = 'http://lasse/WebApplication2/WebForm1.aspx?id_town=1'">
<td>
<table class="MenuItem" id="navm1" cellpadding="0" cellspacing="0" border="0" width="100%" onMouseOver="ExpandMainMenu(this.id, 'navs2')">
<tr>
<td><b>Pheonix</b></td>
<td align="right" style="padding:0;" width="15"><img src="arrow.gif" border="0" alt="Yeah" /></td>
</tr>
</table>
</td>
</tr>
</table>
</div>

<div id="subs" class="undermenu" ><table class="MenuGroup" id="navs2" cellpadding="0" cellspacing="0" border="0" width="100%" style="width:190px;position:absolute;visibility:hidden;left:190;top:0px;z-index:9;" onmouseover="CollapseSubMenu('false')" onmouseout="CollapseSubMenu('true')">
<tr onMouseOver="ChangeBackground(this, '#cccccc')" onMouseOut="ChangeBackground(this, 'white')" onclick="window.location.href = 'http://lasse/WebApplication2/WebForm1.aspx?id_attractions=2'">
<td>ARCOSANTI</td>
</tr>
<tr onMouseOver="ChangeBackground(this, '#cccccc')" onMouseOut="ChangeBackground(this, 'white')" onclick="window.location.href = 'http://lasse/WebApplication2/WebForm1.aspx?id_attractions=3'">
<td>Arizona Science Center</td>
</tr>
<tr onMouseOver="ChangeBackground(this, '#cccccc')" onMouseOut="ChangeBackground(this, 'white')" onclick="window.location.href = 'http://lasse/WebApplication2/WebForm1.aspx?id_attractions=4'">
<td>Desert Botanical Garden</td>
</tr>
</table>


</div>
            <div id="desc" style="position:absolute;left:300;top:10;"><table style="left:300;z-index:5"><tr><td bgcolor='#aaaaaa'>Contrary to popular belief, LA does have an intellectual, refined side. When you're shopped, glitzed, tanned and rollercoastered out, head for some of the best museums in the USA. Top of the list has to be the John Paul Getty collection of museums. The museum's European and photography and numerous other collections are now on display at the stunning 110-acre (45 hectare) Getty Center in the Santa Monica mountains, opened in 1998 following 14 years of planning and construction at a cost of a cool billion. Admission is free, making this one of the best bargains in town.</td></tr></table></div>
        </form>
    </body>
</HTML>
Avatar billede roenving Novice
31. januar 2004 - 21:05 #5
Hvorfor flytter du ikke al din style ud i stylesheetet ?-)

Fejlen var her:

<div id="subs" ><table class="MenuGroup" id="navs2" cellpadding="0" cellspacing="0" border="0" width="100%" style="width:190px;position:absolute;visibility:hidden;left:190;top:0px;z-index:9;" onmouseover="CollapseSubMenu('false')" onmouseout="CollapseSubMenu('true')">
<tr class="undermenu" onMouseOver="ChangeBackground(this, '#cccccc')" onMouseOut="ChangeBackground(this, 'white')" onclick="window.location.href = 'http://lasse/WebApplication2/WebForm1.aspx?id_attractions=2'">
<td>ARCOSANTI</td>
</tr>
<tr class="undermenu" onMouseOver="ChangeBackground(this, '#cccccc')" onMouseOut="ChangeBackground(this, 'white')" onclick="window.location.href = 'http://lasse/WebApplication2/WebForm1.aspx?id_attractions=3'">
<td>Arizona Science Center</td>
</tr>
<tr class="undermenu" onMouseOver="ChangeBackground(this, '#cccccc')" onMouseOut="ChangeBackground(this, 'white')" onclick="window.location.href = 'http://lasse/WebApplication2/WebForm1.aspx?id_attractions=4'">
<td>Desert Botanical Garden</td>
</tr>
</table>
Avatar billede Lasse Novice
31. januar 2004 - 21:10 #6
cool manner... takker skal du have... ja, jeg skal have flyttet ting ud i style sheets... er lige igang med at udvikle, men tilsidst skal det laves perfekt.

Hvis du er soed at svare, saa er der points. Tak endnu engang
Avatar billede roenving Novice
31. januar 2004 - 21:11 #7
Velbekomme '-)
Avatar billede roenving Novice
31. januar 2004 - 21:21 #8
-- og tak for points ;~}
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester