Avatar billede stkol Nybegynder
20. maj 2003 - 11:43 Der er 17 kommentarer og
1 løsning

Problem med ASP/Javascript menu!

Hej!

Jeg har en JavaScript menu som jeg gerne vil have lavet dynamisk med ASP, dette kan jeg også men har et problem med at den smidder menuerne oven på hindanden (DIV) og ikke som den skal neden under hinanden som den gerne skulle!

Min kode er som følger : (Er ikke færdigt hvad angår ASP)

<%
    Dim dbDocEditConn
    Dim connection
    Dim rs
    Dim rslink
    Dim linkConn
    Dim linkSql

    '####### Document info ############
    '## Create db objects and SQL   
    set dbDocEditConn = Server.CreateObject("ADODB.Connection")
    dbDocEditConn.Open Application("ConnectString")
    Set rs = Server.CreateObject("ADODB.Recordset")

    sql = "SELECT * FROM documents;"

    Set rs = dbDocEditConn.Execute(sql)
   
    '####### link ############
    '## Create db objects and SQL   
    set linkConn = Server.CreateObject("ADODB.Connection")
    linkConn.Open Application("ConnectString")
    Set rslink = Server.CreateObject("ADODB.Recordset")

    linkSql = "SELECT * FROM link WHERE link.menuid=" & request.querystring("menurecordid") & " ORDER BY link.link;"

    Set rslink = linkConn.Execute(linkSql)

%>


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>
<head>

    <title></title>
   
<style type="text/css">
a
{text-decoration: none;
color: #CC0033;
}
   

A:HOVER {
    background-color : #CC0033;
    color: White;
}

.title
{position: absolute;
width: 100px;
height: 20px;
left: 10px;
z-index: 10;
font-family: verdana, helvetica, sans-serif;
font-weight: bold;
font-size: 12px;}

.submenu
{position: absolute;
left: 25px;
width: 120px;
border: 1px solid #CC0033;
background-color: #FFFFFF;
layer-background-color: #FFFFFF;
font-family: verdana, helvetica, sans-serif;
font-size: 10px;
visibility: hidden;}
</style>

<SCRIPT LANGUAGE="JavaScript">

var nom = 4; // Number of menus
var usePictures = 1; // use pictures?  1 = yes, 0 = no

var ttls = new Array(); // An array for the title objects
var subs = new Array(); // An array for the submenu objects
var lastn;
var lastmove;

if (document.layers) {
visible = 'show';
hidden = 'hide';
}
else
if (document.all) {
visible = 'visible';
hidden = 'hidden';
}
for (var i = 1; i <= nom; i++) {
ttls[i] = ('title' + i);
subs[i] = ('submenu' +i);
}
function picopen(n) {
title = ('title' + n);
pic = ('pic' + n);
if (document.layers) {
document.layers[title].document.images[pic].src = "../../frame/img/opened.gif";
}
else if (document.all) {
document.all(pic).src = "../../frame/img/opened.gif";
  }
}
function picclose(n) {
title = ('title' + n);
pic = ('pic' + n);
if (document.layers) {
document.layers[title].document.images[pic].src = "../../frame/img/closed.gif";
}
else if (document.all) {
document.all(pic).src = "../../frame/img/closed.gif";
  }
}
lastn = (nom + 1);
lastmove = 0;
function lasttoggle(n,move) {
if (n <= nom) {
menu = ('submenu' + n);
if (document.layers) {
submenu = document.layers[menu];
}
else if (document.all) {
submenu = document.all(menu).style;
}
if (submenu.visibility == visible) {
submenu.visibility = hidden;
picclose(n); // Remove this if you don't use pictures
for (var i = (n+1); i <= nom; i++) {
if (document.layers) {
document.layers[ttls[i]].top -= move;
document.layers[subs[i]].top -= move;
}
else if (document.all) {
document.all(ttls[i]).style.pixelTop -= move;
document.all(subs[i]).style.pixelTop -= move;
            }
        }
      }
  }
}
function toggle(n,move) {
menu = ('submenu' + n);
if (document.layers) {
submenu = document.layers[menu];
}
else if (document.all) {
submenu = document.all(menu).style;
}
if (submenu.visibility == visible) {
submenu.visibility = hidden;
if (usePictures) picclose(n);
for (var i = (n+1); i <= nom; i++) {
if (document.layers) {
document.layers[ttls[i]].top -= move;
document.layers[subs[i]].top -= move;
}
else if (document.all) {
document.all(ttls[i]).style.pixelTop -= move;
document.all(subs[i]).style.pixelTop -= move;
      }
  }
}
else {
submenu.visibility = visible;
if (usePictures) picopen(n);
if (lastn != n) {
lasttoggle(lastn,lastmove);
}
for (var i = (n+1); i <= nom; i++) {
if (document.layers) {
document.layers[ttls[i]].top += move;
document.layers[subs[i]].top += move;
}
if (document.all) {
document.all(ttls[i]).style.pixelTop += move;
document.all(subs[i]).style.pixelTop += move;
      }
  }
}
lastn = n;
lastmove = move;
}
//  End -->
</script>

</head>

<body bgColor="#FFFFFF">

<% While (not rslink.EOF)%>
<div class="title" id="title<%=rslink("recordid")%>" style="top: 0px">
<a href="#" onclick="java script: toggle(1,30); return false"><img name="pic1" src="../../frame/img/closed.gif" border="0"><%=rslink("link")%></a>
</div>

<div class="submenu" id="submenu<%=rslink("recordid")%>" style="top: 20px">
<a href="page01.html" target="right">Item # 1</a><br>
<a href="page02.html" target="right">Item # 2</a>
</div>
<%
    rslink.movenext
      wend
%>

</body>
</html>

Kan nogen hjælpe mig med dette??

/Stig :-)
Avatar billede roenving Novice
20. maj 2003 - 11:48 #1
<%
her skal du lave en beregning af, hvor langt du er kommet med din submenu, f.eks.
top=<%=rslink("recordid")%>*20
%>

<div class="submenu" id="submenu<%=rslink("recordid")%>" style="top: <%=top%>px">
<a href="page01.html" target="right">Item # 1</a><br>
<a href="page02.html" target="right">Item # 2</a>
</div>

OBS! jeg kender _ikke_ ASP og dermed syntaksen, men princippet er sådan ...
Avatar billede stkol Nybegynder
20. maj 2003 - 11:56 #2
Er det i den der hedder toogle jeg skal lave denne ?!?
Avatar billede roenving Novice
20. maj 2003 - 12:01 #3
-- det er til allersidst i din dumpede kode ...
Avatar billede stkol Nybegynder
20. maj 2003 - 12:04 #4
Okay! Altså sådan her

<%
    rslink.movenext
    top=<%=rslink("recordid")%>*20
    wend
%>
Avatar billede roenving Novice
20. maj 2003 - 12:12 #5
-- så næstsidst .-)

.
.
.
.
.
.
.
.
.
.
.

</div>

<%
    top=<%=rslink("recordid")%>*20
%>

<div class="submenu" id="submenu<%=rslink("recordid")%>" style="top: <%=top%>px">
<a href="page01.html" target="right">Item # 1</a><br>
<a href="page02.html" target="right">Item # 2</a>
</div>
<%
    rslink.movenext
      wend
%>

</body>
</html>

-- jeg er stadig overhovedet ikke med på den præcise syntaks ...
Avatar billede stkol Nybegynder
20. maj 2003 - 12:32 #6
Det går desværer bare ikke, fordi rslink("recordid") kan bestå af tal som ikke kommer lige efter hindanden F.eks hvis der er 4 records kan de se sådan her ud:

recordid    name

4            test1
20          test2
26          test3
50          test4

Hvilket ville give dette resultat :

4  * 20  =  80     
20 * 20  =  400   
26 * 20  =  520 
50 * 20  =  1000

Og så vil der jo være stor spredning på menuen, det jeg nok har brug for er en tæller som kan give mig en fast stigning som dette

0
20
40
60
Avatar billede roenving Novice
20. maj 2003 - 12:36 #7
Ja, men så

<%
  tael=tael+1
  top=tael*20
%>
Avatar billede stkol Nybegynder
20. maj 2003 - 13:08 #8
Kanont! det hjalp på positioneringen af hoved linket, men når jeg klikker på linket, skulle den gerne udvide sig så man ser de underliggende sublinks men det gør den ikke, den skriver dem bare oven i de andre????

Har du en løsning til det???
Avatar billede stkol Nybegynder
20. maj 2003 - 13:23 #9
Jeg er lige faldet over en sjov ting ved den tæller.

Dette :

########################################

<%
    While (not rslink.EOF)
%>
<div class="title" id="title<%=rslink("recordid")%>" style="top: <%=top%>px">
<a href="#" onclick="java script: toggle(<%=toggle1%>,30); return false"><img name="pic1" src="../../frame/img/closed.gif" border="0"><%=rslink("link")%></a>
</div>
<%
  tael=tael+1
  top=tael*20
  step1=step1+1
  toggle1=step1
%>
<div class="submenu" id="submenu<%=rslink("recordid")%>" style="top: <%=top%>px">
<a href="page01.html" target="right">Item # 1</a><br>
<a href="page02.html" target="right">Item # 2</a>
</div>
<%
    rslink.movenext
      wend
%>

########################################

Giver :


########################################

<div class="title" id="title1" style="top: px">
<a href="#" onclick="java script: toggle(,30); return false"><img name="pic1" src="../../frame/img/closed.gif" border="0">asp</a>
</div>



<div class="submenu" id="submenu1" style="top: 20px">
<a href="page01.html" target="right">Item # 1</a><br>
<a href="page02.html" target="right">Item # 2</a>
</div>




<div class="title" id="title5" style="top: 20px">
<a href="#" onclick="java script: toggle(1,30); return false"><img name="pic1" src="../../frame/img/closed.gif" border="0">asp2</a>
</div>



<div class="submenu" id="submenu5" style="top: 40px">
<a href="page01.html" target="right">Item # 1</a><br>
<a href="page02.html" target="right">Item # 2</a>
</div>




<div class="title" id="title6" style="top: 40px">
<a href="#" onclick="java script: toggle(2,30); return false"><img name="pic1" src="../../frame/img/closed.gif" border="0">asp3</a>
</div>



<div class="submenu" id="submenu6" style="top: 60px">
<a href="page01.html" target="right">Item # 1</a><br>
<a href="page02.html" target="right">Item # 2</a>
</div>

#####################################

Læg mærke til at den ikke skriver noget i den første af menu punkterne?!?!? Hvad kan være galt??
Avatar billede roenving Novice
20. maj 2003 - 13:29 #10
Måske sådan ...

<% While (not rslink.EOF)%>


<%
  tael=tael+1
  top=tael*20
%>


<div class="title" id="title<%=tael%>" style="top: 0px">
<a href="#" onclick="java script: toggle(<%=tael%>,30); return false"><img name="pic1" src="../../frame/img/closed.gif" border="0"><%=rslink("link")%></a>
</div>

<div class="submenu" id="submenu<%=tael%>" style="top: <%=top%>px">
<a href="page01.html" target="right">Item # 1</a><br>
<a href="page02.html" target="right">Item # 2</a>
</div>
<%
    rslink.movenext
      wend
%>
Avatar billede stkol Nybegynder
20. maj 2003 - 13:35 #11
Desværer ikke, det giver bare dette resultat :

<div class="title" id="title1" style="top: 20px">
<a href="#" onclick="java script: toggle(1,30); return false"><img name="pic1" src="../../frame/img/closed.gif" border="0">asp</a>
</div>


<div class="submenu" id="submenu1" style="top: 20px">
<a href="page01.html" target="right">Item # 1</a><br>
<a href="page02.html" target="right">Item # 2</a>
</div>




<div class="title" id="title5" style="top: 40px">
<a href="#" onclick="java script: toggle(2,30); return false"><img name="pic1" src="../../frame/img/closed.gif" border="0">asp2</a>
</div>


<div class="submenu" id="submenu5" style="top: 40px">
<a href="page01.html" target="right">Item # 1</a><br>
<a href="page02.html" target="right">Item # 2</a>
</div>




<div class="title" id="title6" style="top: 60px">
<a href="#" onclick="java script: toggle(3,30); return false"><img name="pic1" src="../../frame/img/closed.gif" border="0">asp3</a>
</div>


<div class="submenu" id="submenu6" style="top: 60px">
<a href="page01.html" target="right">Item # 1</a><br>
<a href="page02.html" target="right">Item # 2</a>
</div>

Den starter med 20 og ikke 0 som den gerne skulle!!
Avatar billede stkol Nybegynder
20. maj 2003 - 13:38 #12
Undskyld! det var et forkert eksempel. Det giver dette :

<div class="title" id="title1" style="top: 0px">
<a href="#" onclick="java script: toggle(1,30); return false"><img name="pic1" src="../../frame/img/closed.gif" border="0">asp</a>
</div>

<div class="submenu" id="submenu1" style="top: 20px">
<a href="page01.html" target="right">Item # 1</a><br>
<a href="page02.html" target="right">Item # 2</a>
</div>

<div class="title" id="title2" style="top: 0px">
<a href="#" onclick="java script: toggle(2,30); return false"><img name="pic1" src="../../frame/img/closed.gif" border="0">asp2</a>
</div>

<div class="submenu" id="submenu2" style="top: 40px">
<a href="page01.html" target="right">Item # 1</a><br>
<a href="page02.html" target="right">Item # 2</a>
</div>

<div class="title" id="title3" style="top: 0px">
<a href="#" onclick="java script: toggle(3,30); return false"><img name="pic1" src="../../frame/img/closed.gif" border="0">asp3</a>
</div>

<div class="submenu" id="submenu3" style="top: 60px">
<a href="page01.html" target="right">Item # 1</a><br>
<a href="page02.html" target="right">Item # 2</a>
</div>
Avatar billede stkol Nybegynder
20. maj 2003 - 13:38 #13
Altså 0 i TITLE hele vejen!!
Avatar billede roenving Novice
20. maj 2003 - 13:42 #14
Vi tager den med også:

<% While (not rslink.EOF)%>


<%
  tael=tael+1
  top=tael*30
  subtop=top+20
%>


<div class="title" id="title<%=tael%>" style="top: <%=top%>px">
<a href="#" onclick="java script: toggle(<%=tael%>,30); return false"><img name="pic1" src="../../frame/img/closed.gif" border="0"><%=rslink("link")%></a>
</div>

<div class="submenu" id="submenu<%=tael%>" style="top: <%=subtop%>px">
<a href="page01.html" target="right">Item # 1</a><br>
<a href="page02.html" target="right">Item # 2</a>
</div>
<%
    rslink.movenext
      wend
%>
Avatar billede stkol Nybegynder
20. maj 2003 - 13:51 #15
Y E S !!!!! Nu virker det hele *S TUSIND tak for hjælpen og tålmodigheden *S

Smider du lige et svar så du kan få dine velfortjente point???
Avatar billede roenving Novice
20. maj 2003 - 13:57 #16
Muy bueno '-)
Avatar billede roenving Novice
20. maj 2003 - 16:31 #17
Takker for points ;~}
Avatar billede stkol Nybegynder
20. maj 2003 - 17:06 #18
Velbekomme *S
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
Kurser inden for grundlæggende programmering

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

IT-JOB

Forsvarsministeriets Materiel- og Indkøbsstyrelse

Solution Manager til Cyberdivisionen

Forsvarets Efterretningstjeneste

Network engineer - Datacenter & Automation

KMD A/S

Projektleder