Javascript sidemenu og asp/Mysql
Jeg har hentet to forskellige scripts på nettet. Jeg kan ikke selv programmere ret meget JavaScript...**************************
Først en fil med en side-"menu":
<html>
<head>
<style>
<!--
#slidemenubar, #slidemenubar2{
position:absolute;
left:-140px;
width:180px;
top:170px;
border:1.5px solid #ff0000;
background-color:#000000;
layer-background-color:#E7E3DB;
font:bold 12px Verdana;
line-height:20px;
}
-->
</style>
</head>
<body>
<!-- SCRIPT - Sidemenu -->
<script language="JavaScript1.2">
/////////////////////////////////////////////////////////
var ns4=document.layers?1:0
var ie4=document.all?1:0
var ns6=document.getElementById&&!document.all?1:0
if (ie4||ns6)
document.write('<div id="slidemenubar2" style="left:-154" onMouseover="pull()" onMouseout="draw()">')
else
document.write('<layer id="slidemenubar" onMouseover="pull()" onMouseout="draw()">')
var sitems=new Array()
var sitemlinks=new Array()
// Linktekster
// sitems[0]="Link0"
// sitems[1]="Link1"
// sitems[2]="Link2"
// sitems[3]="Link3"
// sitems[4]="Link4"
// sitems[5]="Link5"
// sitems[6]="Link6"
// sitems[7]="Link7"
// sitems[8]="Link8"
// sitems[9]="Link9"
// Indtast url til links
// sitemlinks[0]="http://www.collies.dk"
// sitemlinks[1]="http://www.collies.dk"
// sitemlinks[2]="http://www.collies.dk"
// sitemlinks[3]="http://www.collies.dk"
// sitemlinks[4]="http://www.collies.dk"
// sitemlinks[5]="http://www.collies.dk"
// sitemlinks[6]="http://www.collies.dk"
// sitemlinks[7]="http://www.collies.dk"
// sitemlinks[8]="http://www.collies.dk"
// sitemlinks[9]="http://www.collies.dk"
// Her kan du definere om links skal åbnes i et andet vindue eller ramme.
// _self svarer til samme ramme. _blank svarer til et nyt vindue.
var target="_blank"
// Her kan du definere hastigheden som menuen glider ind og ud med
udHast=30
indHast=40
///////////////////////////////////////////////////////
// CH indsat
// document.write('<table><tr><td width=160>')
// for (i=0;i<=sitems.length-1;i++)
// document.write('<a href='+sitemlinks[i]+' target="'+target+'">'+sitems[i]+'</a><br>')
function regenerate(){
window.location.reload()
}
function regenerate2(){
if (ns4)
setTimeout("window.onresize=regenerate",400)
}
window.onload=regenerate2
if (ie4||ns6){
document.write('</div>')
themenu=(ns6)? document.getElementById("slidemenubar2").style : document.all.slidemenubar2.style
rightboundary=0
leftboundary=-150
}
else{
document.write('</layer>')
themenu=document.layers.slidemenubar
rightboundary=150
leftboundary=10
}
function pull(){
if (window.drawit)
clearInterval(drawit)
pullit=setInterval("pullengine()",udHast)
}
function draw(){
clearInterval(pullit)
drawit=setInterval("drawengine()",indHast)
}
function pullengine(){
if (ie4&&themenu.pixelLeft<rightboundary)
themenu.pixelLeft+=5
else if (ns6&&parseInt(themenu.left)<rightboundary)
themenu.left=parseInt(themenu.left)+5
else if( ns4&&themenu.left<rightboundary)
themenu.left+=5
else if (window.pullit)
clearInterval(pullit)
}
function drawengine(){
if (ie4&&themenu.pixelLeft>leftboundary)
themenu.pixelLeft-=5
else if (ns6&&parseInt(themenu.left)>leftboundary)
themenu.left=parseInt(themenu.left)-5
else if(ns4&&themenu.left>leftboundary)
themenu.left-=5
else if (window.drawit)
clearInterval(drawit)
}
</script>
<!-- SCRIPT - Sidemenu - SLUT -->
*****************************
Derefter en fil med en anden menu:
<Html>
<Head>
<style type="text/css">
.menutitle{
cursor:pointer;
margin-bottom: 5px;
background-color:#2C8E71;
color:#000000;
width:140px;
padding:2px;
text-align:center;
font-weight:bold;
/*/*/border:1px solid #000000;/* */
}
.submenu{
margin-bottom: 0.5em;
}
</style>
<script type="text/javascript">
if (document.getElementById){ //
document.write('<style type="text/css">\n')
document.write('.submenu{display: none;}\n')
document.write('</style>\n')
}
function SwitchMenu(obj){
if(document.getElementById){
var el = document.getElementById(obj);
var ar = document.getElementById("masterdiv").getElementsByTagName("span"); // change
if(el.style.display != "block"){ //DynamicDrive.com change
for (var i=0; i<ar.length; i++){
if (ar[i].className=="submenu") //
ar[i].style.display = "none";
}
el.style.display = "block";
}else{
el.style.display = "none";
}
}
}
</script>
</head>
<Body>
<link rel="stylesheet" href="menu.css" type="text/css">
<div id="masterdiv">
<%
'Henter db-forbindelse
%>
<!--#include file="dbfil_ch.asp"-->
<%
'Henter overskrifter
Set RS = myConn.Execute("SELECT Navn, Nr_1 FROM Collies_dk_menu where Nr_2 = '' Order by Nr_1")
If RS.EOF Then
'Hvis der ingen overskrifter er:
Response.write "Der er opstået en fejl - prøv at opdatere denne side..."
Else
'så ryk til den første post i tabel
rs.movefirst
' kør en lykke til den har være igennem alle poster i tabel
DO UNTIL RS.EOF
%>
<div class="menutitle" onclick="SwitchMenu('sub<% Response.write RS("NR_1") %>')"><Font face=verdana color=black size=2><% Response.write RS("Navn") %></font></div>
<span class="submenu" id="sub<% Response.write RS("NR_1") %>">
<%
'Undermenu
Set RS2 = myConn.Execute("SELECT Navn, Link FROM Collies_dk_menu where Nr_1 = '" & RS("Nr_1") & "' And Nr_2 <> '' Order by Nr_2")
If RS2.EOF Then
'Hvis der ingen undermenuer er
Response.write "<BR><I>Ingen undermenu - fejl</I>"
Else
'så ryk til den første post i tabel
rs2.movefirst
' kør en lykke til den har være igennem alle poster i tabel
DO UNTIL RS2.EOF
Response.write "<Font face=verdana color=black size=1>- </font><a href='" & RS2("Link") & "'><Font face=verdana color=black size=1>" & RS2("Navn") & "</font></a><BR>"
'ryk en frem i tabel
rs2.movenext
'start lykke igen
loop
End if
%>
</span>
<%
'ryk en frem i tabel
rs.movenext
'start lykke igen
loop
Response.write "</div>"
End if
%>
</Body>
</html>
*********************
Sidste fil ser oprindelig således ud:
<Html>
<Head>
<style type="text/css">
.menutitle{
cursor:pointer;
margin-bottom: 5px;
background-color:#ECECFF;
color:#000000;
width:140px;
padding:2px;
text-align:center;
font-weight:bold;
/*/*/border:1px solid #000000;/* */
}
.submenu{
margin-bottom: 0.5em;
}
</style>
<script type="text/javascript">
/*************************************************
* *
* MENU af Houlborg WEBdesign - www.houlborg.dk *
* *
**************************************************/
if (document.getElementById){ //
document.write('<style type="text/css">\n')
document.write('.submenu{display: none;}\n')
document.write('</style>\n')
}
function SwitchMenu(obj){
if(document.getElementById){
var el = document.getElementById(obj);
var ar = document.getElementById("masterdiv").getElementsByTagName("span"); // change
if(el.style.display != "block"){ //DynamicDrive.com change
for (var i=0; i<ar.length; i++){
if (ar[i].className=="submenu") //
ar[i].style.display = "none";
}
el.style.display = "block";
}else{
el.style.display = "none";
}
}
}
</script>
</head>
<Body>
<div id="masterdiv">
<div class="menutitle" onclick="SwitchMenu('sub1')">Link1</div>
<span class="submenu" id="sub1">
- <a href="new.htm">Link 1-1</a><br>
- <a href="hot.htm">Link 1-2</a><br>
- <a href="revised.htm">Link 1-3</a><br>
- <a href="morezone/">Link 1-4</a>
</span>
<div class="menutitle" onclick="SwitchMenu('sub2')">Link2</div>
<span class="submenu" id="sub2">
- <a href="notice.htm">Usage Terms</a><br>
- <a href="faqs.htm">DHTML FAQs</a><br>
- <a href="help.htm">Scripts FAQs</a>
</span>
<div class="menutitle" onclick="SwitchMenu('sub3')">Link3</div>
<span class="submenu" id="sub3">
- <a href="http://www.codingforums.com">Coding Forums</a><br>
</span>
<div class="menutitle" onclick="SwitchMenu('sub4')">Link4</div>
<span class="submenu" id="sub4">
- <a href="http://www.javascriptkit.com">JavaScript Kit</a><br>
- <a href="http://www.freewarejava.com">Freewarejava</a><br>
- <a href="http://www.cooltext.com">Cool Text</a><br>
- <a href="http://www.google.com">Google.com</a>
</span>
<!--
<img src="about.gif" onclick="SwitchMenu('sub6')"><br>
<span class="submenu" id="sub6">
- <a href="http://www.dynamicdrive.com/link.htm">Link to DD</a><br>
- <a href="http://www.dynamicdrive.com/recommendit/">Recommend Us</a><br>
- <a href="http://www.dynamicdrive.com/contact.htm">Email Us</a><br>
</span>
-->
</div>
</Body>
</html>
Jeg vil gerne flette min menu ind i den første vil. Altså sådan at jeg har den dims der kommer ud i den og springer frem... Men med den anden fil på siden... Forstår I?
Jeg skal hente min menu fra MySQL (ASP)...
Derfor ændringen i filen
Hvordan sætter jeg dem sammen?
Hvis en gør det for mig er der fuld point...
Første fil er hentet her, se eks:
http://www.a-begynder.dk/scripts/javascript/andet/javascript_startside.htm
Anden fil er hentet her, se eks:
http://www.dynamicdrive.com/dynamicindex1/switchmenu.htm
