Uitschuifmenu met submenu's, hoe maak ik dit in frontpage??

Pervano · 4 jul 2007

Hallo, ik wil graag mijn website veranderen, en dan vooral, wil ik een uitschuifmenu hebben met submenu's daarin. het moet wel op de homepage komen en die heb ik in frame's gemaakt. heb het zelf al geprbeert met een scriptcode van "leejoo", maar als ik hem dan in een voorbeeld wil zien dan, zie ik hem niet verschijnen. Wie kan mij hier bij helpen???

// Robert G. ^^ · 4 jul 2007

Hier is een site waar ik momenteel mee bezig ben, bedoel je zoiets?

Klik

Pervano · 4 jul 2007

Hallo, ja inderdaad zoiets bedoel ik ook. Ku je mij ook uitleggen hoe ik dit kan verwerken in mijn eigen site?

McMeller · 4 jul 2007

http://www.leejoo.nl/java/menu/dynamisch_vertikaal_menu.htm
http://www.leejoo.nl/java/menu/uitschuif_menu.htm

Klik hier voor alles.

Pervano · 4 jul 2007

Deze heb ik al geprobeerd, maar als ik de codes plaats dan krijg ik het niet te zien in de voorbeeld, ook in de code staat dan: "Op deze pagina worden frames gebruikt, maar uw browser ondersteunt geen frames". kan ik hier wat aan veranderen zodat het menu wel zichtbaar word?? Ik heb mijn website in frontpage 2003 gemaakt.

// Robert G. ^^ · 5 jul 2007

Bekijk hem eens niet via Frontpage maar gewoon via IE of FF.

Pervano · 5 jul 2007

OOk als ik hem in IE bekijk dan zie ik mijn menu niet. Denk inderdaad dat het komt om dat dit ( Op deze pagina worden frames gebruikt, maar uw browser ondersteunt geen frames) in de html bewerkpagina staat. Dus hoe kan ik het probleem oplossen, zodat mijn browser wel de frame's ondersteunt.

peter vazed · 6 jul 2007

Plaats de code van je frameset eens hier.
Of is het al online?

Pervano · 6 jul 2007

nee heb hem nog niet online, het moet nl de nieuwe homepage van mijn website worden, en zolang die nog niet klaar is, laat ik de oude homepage nog online staan.
hierbij de code:
<html>

<head>
<script language="JavaScript">
function goToURL() { history.go(-1); }
</script>
<style>
.menu
{
background-color:#6666FF;
border:1px solid darkblue;
width:150px;
font-size:11px;
font-family:verdana;
position: absolute;
font:bold;
color: #ffffff;
cursor: hand;
}
.item_panel
{
width:150px;
border-left:1px solid darkblue;
border-right:1px solid darkblue;
clip:rect(0,150,0,0);
position:absolute;
}
.item_panel a
{
text-decoration:none;
color:black;
cursor:hand;
}
.item
{
background-color: #99CCFF;
width: 148px;
font-size: 10px;
font-family: verdana;

}
</style>

<script language="JavaScript">
var height = 20; // Hoogte van de hoofdmenu linken
var iheight = 15; // hoogte van de menu elementen
var bgc = "#D8D8D8" // Achtergrondkleur menu element
var tc = "black" // text kleur van het menu element
var over_bgc = "#FFFFFF";//achtergrondkleur menu item bij mouse-over
var over_tc = "#FF0000"; //teskt kleur bij mouse-over
var speed = 0;
var timerID = "";
var N = (document.all) ? 0 : 1;
var width = 152;
var self_menu = new Array();
function write_menu()
{
smc = 0;
document.write("<div style='position:absolute'>");
mn = 0;
mni = 1;
start = -1;
for(i=0;i<Link.length;i++)
{
la = Link.split("|");
if (la[0] == "0")
{
if(start == 0)
{
document.write("</div>");
h = csmc * iheight;
tmn = mn; //-h
self_menu[smc] = new Array(tmn,h,0,-2);
smc++;
mn--;
}
csmc = 0;
document.write("<div class='menu' style='top:"+mn+";height:"+height+"' id='down"+smc+"' onclick='pull_down("+smc+","+mni+")'> "+ la[1] + "</div>");
self_menu[smc] = new Array(mn,height,0,mni);
smc++;
mni++;
mn+=height;
start = 1;
}
else
{
if(start == 1)
{
if(N)mn+=2;
document.write("<div class='item_panel' id='down"+smc+"' style='top:"+mn+"'>");
start = 0;
}

document.write("<a href='"+la[2]+"'");
if (la[3] != "") document.write(" target='" + la[3] + "' ");
document.write("><div class='item' id='d"+i+"' style='height:"+iheight);
if (N) document.write(";width:150");
document.write("' onmouseover='color(this.id)' onmouseout='uncolor(this.id)'> "+ la[1] + "</div></a>");
csmc++;
}
}
if (start == 0)
{
document.write("</div>");
h = csmc * iheight;
tmn = mn + 5; //-h
self_menu[smc] = new Array(tmn,h,0);
name = "down" + (self_menu.length-1);
obj = document.getElementById(name);
obj.style.borderBottomColor = "darkblue";
obj.style.borderBottomWidth = 1;
obj.style.borderBottomStyle = "solid";
}
document.write("</div>");}
function color(obj)
{
document.getElementById(obj).style.backgroundColor = over_bgc;
document.getElementById(obj).style.color = over_tc
}

function uncolor(obj)
{
document.getElementById(obj).style.backgroundColor = bgc;
document.getElementById(obj).style.color = tc
}

function pull_down(nr,c)
{
if (timerID == "")
{
to = self_menu[nr+1][1]
begin = nr + 2;
if (timerID != "") clearTimeout(timerID);
if (self_menu[nr+1][2] == 0)
{
self_menu[nr+1][2] = 1;
if(nr == self_menu.length-2) {to++;}
epull_down(begin,to,0);
}
else
{
to = 0;
self_menu[nr+1][2] = 0;
name = "down"+(nr+2);
open_item = 0;
for(i=0;i<nr;i++)
{
if(self_menu[2] == 1)
{open_item += self_menu[1];
}
}
if (N == false) {open_item-= (c*1)};
if (nr== self_menu.length-2) {val = self_menu[self_menu.length-1][1];to=-1;}
else val = parseInt(document.getElementById(name).style.top) -(open_item)-(c*height);
epull_up(begin,to,val);
}
}
}

function epull_down(nr,to,nowv)
{
name = "down" + (nr-1);
obj = document.getElementById(name).style.clip = "rect(0,"+width+","+(nowv+1)+",0)";
for (i=nr;i<self_menu.length;i++)
{
name = "down" + i;
obj = document.getElementById(name);
obj.style.top = parseInt(obj.style.top)+1;
}
nowv++;
if(nowv < to) timerID = setTimeout("epull_down("+nr+","+to+","+nowv+")",speed);
else timerID = "";
}

function epull_up(nr,to,nowv)
{
name = "down" + (nr-1);
obj = document.getElementById(name).style.clip = "rect(0,"+width+","+nowv+",0)";
for (i=nr;i<self_menu.length;i++)
{
name = "down" + i;
obj = document.getElementById(name);
obj.style.top = parseInt(obj.style.top)-1;
}
nowv--;
if(nowv > to) timerID = setTimeout("epull_up("+nr+","+to+","+nowv+")",speed);
else timerID = "";
}

function startup(nr)
{
write_menu();
if (nr != 0)
{
for(i=0;i<self_menu.length;i++)
{
if(self_menu[3] == nr) pull_down(i,nr)
i==self_menu.length;
}
}
}
</script>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>TEST HOMEPAGE 2</title>
</head>

<frameset cols="150,*">
<frame name="links" scrolling="no" noresize target="rboven" src="nieuwe_pagina_2.htm">
<frameset rows="20%,*">
<frame name="rboven" target="ronder">
<frame name="ronder">
</frameset>
<noframes>
<body>
<center>
<table width=140>
<tr>
<td>
<script language="JavaScript">
//Link[nr] = "positie [0 is menu/1 is een item],Link naam ,url,target (blank|top|frame_naam)"
// je kunt eenvoudig items toevoegen, gewoon doornummeren
var Link = new Array();
Link[0] = "0|Hoofd link 1";
Link[1] = "1|Sublink 1|http://www.leejoo.nl|blank";
Link[2] = "1|Sublink 1|http://www.leejoo.nl|blank";
Link[3] = "1|Sublink 1|http://www.leejoo.nl|blank";
Link[4] = "1|Sublink 1|http://www.leejoo.nl|blank";
Link[5] = "0|Hoofd link 2";
Link[6] = "1|Sublink 2|http://www.leejoo.nl|blank";
Link[7] = "1|Sublink 2|http://www.leejoo.nl|blank";
Link[8] = "1|Sublink 2|http://www.leejoo.nl|blank";
Link[9] = "1|Sublink 2|http://www.leejoo.nl|blank"
Link[10] = "0|Hoofd link 3";
Link[11] = "1|Sublink 3|http://www.leejoo.nl|blank";
Link[12] = "1|Sublink 3|http://www.leejoo.nl|blank";
Link[13] = "0|Hoofd link 4";
Link[14] = "1|Sublink 4|http://www.leejoo.nl|blank";
Link[15] = "1|Sublink 4|http://www.leejoo.nl|blank";
Link[16] = "1|Sublink 4|http://www.leejoo.nl|blank";
Link[17] = "1|Sublink 4|http://www.leejoo.nl|blank";
Link[18] = "0|Hoofd link 5";
Link[19] = "1|Sublink 5|http://www.leejoo.nl|blank";
Link[20] = "1|Sublink 5|http://www.leejoo.nl|blank";
Link[21] = "1|Sublink 5|http://www.leejoo.nl|blank";
Link[22] = "1|Sublink 5|http://www.leejoo.nl|blank";
startup(0);
</script>
</td>
</tr>
</table>

<p>Op deze pagina worden frames gebruikt, maar uw browser ondersteunt geen
frames.</p>

</body>
</noframes>
</frameset>

</html>

peter vazed · 7 jul 2007

Je index.htm

PHP:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">

<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>TEST HOMEPAGE 2</title>
</head>

<frameset cols="150,*">
<frame name="links" scrolling="no" noresize target="rboven" src="menu.htm">
<frameset rows="20%,*">
<frame name="rboven" target="ronder" src="top.htm">
<frame name="ronder" src="content.htm">
</frameset>
<noframes>
<body>

<p>Op deze pagina worden frames gebruikt, maar uw browser ondersteunt geen
frames.</p>

</body>
</noframes>
</frameset>

</html>

Je menu.htm

PHP:

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
     "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
<title>(Type a title for your page here)</title>
<meta name="GENERATOR" content="Arachnophilia 4.0">
<meta name="FORMATTER" content="Arachnophilia 4.0">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<META name="description" content=" ">
<META name="keywords" content="  ">
<meta name="Author" content="Peter Vazed">
<META name="robots" content="index, follow">
<META name="revisit" content="7 days">
<meta http-equiv="Content-Style-Type" content="text/css">

<script language="JavaScript">
function goToURL() { history.go(-1); }
</script>
<style>
.menu
{
background-color:#6666FF;
border:1px solid darkblue;
width:150px;
font-size:11px;
font-family:verdana;
position: absolute;
font:bold;
color: #ffffff;
cursor: hand;
}
.item_panel
{
width:150px;
border-left:1px solid darkblue;
border-right:1px solid darkblue;
clip:rect(0,150,0,0);
position:absolute;
}
.item_panel a
{
text-decoration:none;
color:black;
cursor:hand;
}
.item
{
background-color: #99CCFF;
width: 148px;
font-size: 10px;
font-family: verdana;

}
</style>

<script language="JavaScript">
var height = 20; // Hoogte van de hoofdmenu linken
var iheight = 15; // hoogte van de menu elementen
var bgc = "#D8D8D8" // Achtergrondkleur menu element
var tc = "black" // text kleur van het menu element
var over_bgc = "#FFFFFF";//achtergrondkleur menu item bij mouse-over
var over_tc = "#FF0000"; //teskt kleur bij mouse-over
var speed = 0;
var timerID = "";
var N = (document.all) ? 0 : 1;
var width = 152;
var self_menu = new Array();
function write_menu()
{
smc = 0;
document.write("<div style='position:absolute'>");
mn = 0;
mni = 1;
start = -1;
for(i=0;i<Link.length;i++)
{
la = Link[i].split("|");
if (la[0] == "0")
{
if(start == 0)
{
document.write("</div>");
h = csmc * iheight;
tmn = mn; //-h
self_menu[smc] = new Array(tmn,h,0,-2);
smc++;
mn--;
}
csmc = 0;
document.write("<div class='menu' style='top:"+mn+";height:"+height+"' id='down"+smc+"' onclick='pull_down("+smc+","+mni+")'> "+ la[1] + "</div>");
self_menu[smc] = new Array(mn,height,0,mni);
smc++;
mni++;
mn+=height;
start = 1;
}
else
{
if(start == 1)
{
if(N)mn+=2;
document.write("<div class='item_panel' id='down"+smc+"' style='top:"+mn+"'>");
start = 0;
}

document.write("<a href='"+la[2]+"'");
if (la[3] != "") document.write(" target='" + la[3] + "' ");
document.write("><div class='item' id='d"+i+"' style='height:"+iheight);
if (N) document.write(";width:150");
document.write("' onmouseover='color(this.id)' onmouseout='uncolor(this.id)'> "+ la[1] + "</div></a>");
csmc++;
}
}
if (start == 0)
{
document.write("</div>");
h = csmc * iheight;
tmn = mn + 5; //-h
self_menu[smc] = new Array(tmn,h,0);
name = "down" + (self_menu.length-1);
obj = document.getElementById(name);
obj.style.borderBottomColor = "darkblue";
obj.style.borderBottomWidth = 1;
obj.style.borderBottomStyle = "solid";
}
document.write("</div>");}
function color(obj)
{
document.getElementById(obj).style.backgroundColor = over_bgc;
document.getElementById(obj).style.color = over_tc
}

function uncolor(obj)
{
document.getElementById(obj).style.backgroundColor = bgc;
document.getElementById(obj).style.color = tc
}

function pull_down(nr,c)
{
if (timerID == "")
{
to = self_menu[nr+1][1]
begin = nr + 2;
if (timerID != "") clearTimeout(timerID);
if (self_menu[nr+1][2] == 0)
{
self_menu[nr+1][2] = 1;
if(nr == self_menu.length-2) {to++;}
epull_down(begin,to,0);
}
else
{
to = 0;
self_menu[nr+1][2] = 0;
name = "down"+(nr+2);
open_item = 0;
for(i=0;i<nr;i++)
{
if(self_menu[i][2] == 1)
{open_item += self_menu[i][1];
}
}
if (N == false) {open_item-= (c*1)};
if (nr== self_menu.length-2) {val = self_menu[self_menu.length-1][1];to=-1;}
else val = parseInt(document.getElementById(name).style.top) -(open_item)-(c*height);
epull_up(begin,to,val);
}
}
}

function epull_down(nr,to,nowv)
{
name = "down" + (nr-1);
obj = document.getElementById(name).style.clip = "rect(0,"+width+","+(nowv+1)+",0)";
for (i=nr;i<self_menu.length;i++)
{
name = "down" + i;
obj = document.getElementById(name);
obj.style.top = parseInt(obj.style.top)+1;
}
nowv++;
if(nowv < to) timerID = setTimeout("epull_down("+nr+","+to+","+nowv+")",speed);
else timerID = "";
}

function epull_up(nr,to,nowv)
{
name = "down" + (nr-1);
obj = document.getElementById(name).style.clip = "rect(0,"+width+","+nowv+",0)";
for (i=nr;i<self_menu.length;i++)
{
name = "down" + i;
obj = document.getElementById(name);
obj.style.top = parseInt(obj.style.top)-1;
}
nowv--;
if(nowv > to) timerID = setTimeout("epull_up("+nr+","+to+","+nowv+")",speed);
else timerID = "";
}

function startup(nr)
{
write_menu();
if (nr != 0)
{
for(i=0;i<self_menu.length;i++)
{
if(self_menu[i][3] == nr) pull_down(i,nr)
i==self_menu.length;
}
}
}
</script>

</head>

<body bgcolor="#ffffff" text="#000000" link="#0000ff" vlink="#800080" alink="#ff0000">


<table width="140"  align="left"  >
<tr>
<td>
<script language="JavaScript">
//Link[nr] = "positie [0 is menu/1 is een item],Link naam ,url,target (blank|top|frame_naam)"
// je kunt eenvoudig items toevoegen, gewoon doornummeren
var Link = new Array();
Link[0] = "0|Hoofd link 1";
Link[1] = "1|Sublink 1|http://www.leejoo.nl|blank";
Link[2] = "1|Sublink 1|http://www.leejoo.nl|blank";
Link[3] = "1|Sublink 1|http://www.leejoo.nl|blank";
Link[4] = "1|Sublink 1|http://www.leejoo.nl|blank";
Link[5] = "0|Hoofd link 2";
Link[6] = "1|Sublink 2|http://www.leejoo.nl|blank";
Link[7] = "1|Sublink 2|http://www.leejoo.nl|blank";
Link[8] = "1|Sublink 2|http://www.leejoo.nl|blank";
Link[9] = "1|Sublink 2|http://www.leejoo.nl|blank"
Link[10] = "0|Hoofd link 3";
Link[11] = "1|Sublink 3|http://www.leejoo.nl|blank";
Link[12] = "1|Sublink 3|http://www.leejoo.nl|blank";
Link[13] = "0|Hoofd link 4";
Link[14] = "1|Sublink 4|http://www.leejoo.nl|blank";
Link[15] = "1|Sublink 4|http://www.leejoo.nl|blank";
Link[16] = "1|Sublink 4|http://www.leejoo.nl|blank";
Link[17] = "1|Sublink 4|http://www.leejoo.nl|blank";
Link[18] = "0|Hoofd link 5";
Link[19] = "1|Sublink 5|http://www.leejoo.nl|blank";
Link[20] = "1|Sublink 5|http://www.leejoo.nl|blank";
Link[21] = "1|Sublink 5|http://www.leejoo.nl|blank";
Link[22] = "1|Sublink 5|http://www.leejoo.nl|blank";
startup(0);
</script>
</td>
</tr>
</table>



</body>

</html>

Pervano · 7 jul 2007

Hoi, ik lijk misschien een beetje dom nu

, maar ben maar een beginnende websitemaker

, met weinig kennis van codes, maar het wel wil leren maar zou je mij in het gewoon nederlands kunnen uitleggen wat ik nu moet doen

.

Alvast bedankt:thumb:

peter vazed · 7 jul 2007

Site met frames:
4 pagina's maken indien je drie frames hebt.
eerste pagina frameset, naam index.htm
tweede pagina: menu.htm met de linken
derde pagina: top.htm waar het logo of iets in die aard komt
vierde pagina: content.htm (of home.htm) met welkomswoord.

Rest van de pagina's namen die je wenst.

Zo doe je dat:
http://home.tiscali.nl/~intad/

Pervano · 7 jul 2007

He, het is me gelukt

, heel erg bedankt voor je advies. :thumb: Heb hem nog niet online, omdat erg nog wat bewerkingen aan gedaan moeten worden maar zodra die klaar is dan geef ik de link nog wel even.

Pervano · 17 jul 2007

Hoi, nou de site is weer online, en zoals beloofd hierbij de link:
http://www.vvalteveer.nl/

Nog bedankt voor jullie hulp..:thumb:

Uitschuifmenu met submenu's, hoe maak ik dit in frontpage??

Pervano

Gebruiker

// Robert G. ^^

Terugkerende gebruiker

Pervano

Gebruiker

McMeller

Terugkerende gebruiker

Pervano

Gebruiker

// Robert G. ^^

Terugkerende gebruiker

Pervano

Gebruiker

peter vazed

Meubilair

Pervano

Gebruiker

peter vazed

Meubilair

Pervano

Gebruiker

peter vazed

Meubilair

Pervano

Gebruiker

Pervano

Gebruiker

Nieuwste berichten

Wij waarderen jouw privacy