Avatar billede cowboy Nybegynder
18. januar 2002 - 20:04 Der er 8 kommentarer og
1 løsning

Dropdown menu M/DW

Er det virkligt så svært at lave en drop down menu ved hjælp af layers og DW, som fungere med frames ???

Forklaring. Det er et frameset med to frames. En top og en center

Jeg har menuen i topframen og al infomationen kommer frem i centerframe.

Ligenu sker der bare det at man ikke kan se dropdown menuen, da den ligger sig bag centerframen

-Cowboy
Avatar billede lokum Nybegynder
18. januar 2002 - 21:17 #1
Det eneste du kan gøre er at rykke din \"centerframe\" længere ned, så der bliver plads til dine dropdowns. (De ligger ikke \"bag\" centerframen, men vises kun i topframens html-visning.)
(o:
Avatar billede lokum Nybegynder
18. januar 2002 - 21:20 #2
Så vidt jeg ved, så må du droppe dit frameset (og arbejde med een html-side ad gangen, hvilket jeg også generelt kan anbefale...) - hvis du vil have dine dropdowns \"ned over\" dine informationer/grafik i \"centerframen\"
Avatar billede pelkjaer Nybegynder
18. januar 2002 - 23:32 #3
Med lidt arbejde kan du godt få submenuerne til at vises i \"mainFrame\".
Avatar billede cowboy Nybegynder
18. januar 2002 - 23:54 #4
Hmmm, lyder interresant !
Avatar billede pelkjaer Nybegynder
19. januar 2002 - 01:23 #5
Nu er det sådan at mit domæne er under redelegering - så jeg kan først uploade et eks. imorgen.

Men jeg kan poste koden her, så kan du selv smide det ind i dw:

Framesettet:

<html>
<head>
<title>Frameset og dropdownmenu</title>
<meta http-equiv=\"Content-Type\" content=\"text/html; charset=iso-8859-1\">
</head>

<frameset rows=\"25,*\" frameborder=\"NO\" border=\"0\" framespacing=\"0\">
  <frame name=\"topFrame\" scrolling=\"NO\" noresize src=\"top.php\" marginwidth=\"0\" marginheight=\"0\" >
  <frame name=\"mainFrame\" src=\"main.php\" marginwidth=\"0\" marginheight=\"0\">
</frameset>
<noframes>
<body bgcolor=\"#FFFFFF\" text=\"#000000\">

</body>
</noframes>
</html>

--------------------------------------------------

topframe:

<html>
<head>
<title>top</title>
<meta http-equiv=\"Content-Type\" content=\"text/html; charset=iso-8859-1\">
<style type=\"text/css\">
<!--
p { 
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 12px;
  color: #FFFFFF;
  text-align: center;
  text-decoration: none
}
p a:link {
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 12px;
  color: #FFFFFF;
  text-align: center;
  text-decoration: none
}
p a:hover {
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 12px;
  color: #FFFFFF;
  text-align: center;
  text-decoration: underline
}
td { 
  height: 25px;
  width: 100px
}
body { 
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 0px;
  margin-left: 0px;
  background-color: #999999
}
-->
</style>
<script language=\"JavaScript\">
<!--
function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf(\"?\"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function P7_autoLayers() { //v1.2 by PVII
var g,b,k,f,args=P7_autoLayers.arguments;
var a = parseInt(args[0]);if(isNaN(a))a=0;
if(!document.p7setc) {p7c=new Array();document.p7setc=true;
  for (var u=0;u<10;u++) {p7c[u] = new Array();}}
for(k=0; k<p7c[a].length; k++) {
  if((g=MM_findObj(p7c[a][k]))!=null) {
  b=(document.layers)?g:g.style;b.visibility=\"hidden\";}}
for(k=1; k<args.length; k++) {
  if((g=MM_findObj(args[k])) != null) {
  b=(document.layers)?g:g.style;b.visibility=\"visible\";f=false;
  for(j=0;j<p7c[a].length;j++) {
    if(args[k]==p7c[a][j]) {f=true;}}
  if(!f) {p7c[a][p7c[a].length++]=args[k];}}}
}
//-->
</script>
</head>
<body>

<div id=\"closertop\" style=\"position:absolute; width:98%; height:98%; z-index:1; left: 0px; top: 0px; visibility: hidden\"><img src=\"1x1.gif\" alt=\"\" width=\"100%\" height=\"100%\" onMouseOver=\"P7_autoLayers(0,\'menu\')\"></div>
<div id=\"menu\" style=\"position:absolute; width:300px; height:25px; z-index:2; left: 0px; top: 0px\">
  <table width=\"300\" border=\"0\" cellspacing=\"0\" cellpadding=\"0\">
    <tr>
      <td bgcolor=\"#0000FF\">
        <p><a href=\"java script:;\" onMouseOver=\"P7_autoLayers(0,\'closertop\',\'menu\',\'divone?mainFrame\',\'menclosermain?mainFrame\')\">link 1</a></p>
      </td>
      <td bgcolor=\"#0099FF\">
        <p><a href=\"java script:;\" onMouseOver=\"P7_autoLayers(0,\'closertop\',\'menu\',\'divtwo?mainFrame\',\'menclosermain?mainFrame\')\">link 2</a></p>
      </td>
      <td bgcolor=\"#00CCFF\">
        <p><a href=\"java script:;\" onMouseOver=\"P7_autoLayers(0,\'closertop\',\'menu\',\'divthree?mainFrame\',\'menclosermain?mainFrame\')\">link 3</a></p>
      </td>
    </tr>
  </table>
</div>
</body>
</html>

--------------------------------------------------

mainframe:

<html>
<head>
<title>main</title>
<meta http-equiv=\"Content-Type\" content=\"text/html; charset=iso-8859-1\">
<style type=\"text/css\">
<!--
p { 
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 12px;
  color: #FFFFFF;
  text-align: center;
  text-decoration: none
}
p a:link {
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 12px;
  color: #FFFFFF;
  text-align: center;
  text-decoration: none
}
p a:hover {
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 12px;
  color: #FFFFFF;
  text-align: center;
  text-decoration: underline
}
td { 
  height: 25px;
  width: 100px
}
body { 
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 0px;
  margin-left: 0px;
  background-color: #CCCCCC
}
-->
</style>
<script language=\"JavaScript\">
<!--
function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf(\"?\"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_showHideLayers() { //v3.0
  var i,p,v,obj,args=MM_showHideLayers.arguments;
  for (i=0; i<(args.length-2); i+=3) if ((obj=MM_findObj(args[i]))!=null) { v=args[i+2];
    if (obj.style) { obj=obj.style; v=(v==\'show\')?\'visible\':(v=\'hide\')?\'hidden\':v; }
    obj.visibility=v; }
}
//-->
</script>
</head>
<body>

<div id=\"divone\" style=\"position:absolute; width:100px; height:150px; z-index:2; background-color: #9900FF; layer-background-color: #9900FF; border: 1px none #000000; left: 0px; top: 10px; visibility: hidden\">
  <br>
  <br>
  <p>menu 1</p>
</div>

<div id=\"divtwo\" style=\"position:absolute; width:100px; height:150px; z-index:3; background-color: #CC00FF; layer-background-color: #CC00FF; border: 1px none #000000; left: 100px; top: 10px; visibility: hidden\">
  <br>
  <br>
  <p>menu 2</p>
</div>

<div id=\"divthree\" style=\"position:absolute; width:100px; height:150px; z-index:4; background-color: #CCCCFF; layer-background-color: #CCCCFF; border: 1px none #000000; left: 200px; top: 10px; visibility: hidden\">
  <br>
  <br>
  <p>menu 3</p>
</div>

<div id=\"menclosermain\" style=\"position:absolute; width:98%; height:98%; z-index:1; left: 0px; top: 10px; visibility: hidden\"><img src=\"1x1.gif\" alt=\"\" width=\"100%\" height=\"100%\" onMouseOver=\"MM_showHideLayers(\'divone\',\'\',\'hide\',\'divtwo\',\'\',\'hide\',\'divthree\',\'\',\'hide\',\'menclosermain\',\'\',\'hide\')\"></div>
</body>
</html>

--------------------------------------------------

Håber at det er til at overskue.
Avatar billede cowboy Nybegynder
19. januar 2002 - 09:27 #6
Det ser godt ud. Jeg kigger på det senere.

Tak for hjælpen
Avatar billede cowboy Nybegynder
19. januar 2002 - 09:28 #7
Er det kompatibelt med netscape 4.7 og opefter og IE 4.0 og opefter ???
Avatar billede pelkjaer Nybegynder
19. januar 2002 - 10:26 #8
NS 4.7 er umiddelbart ikke meget for det, (vil ikke lukke menuerne igen) - men ellers fungerer det fint i IE 5 og 6, NS 6, og Opera 5 og 6.
Avatar billede cowboy Nybegynder
19. januar 2002 - 15:19 #9
Tusind tak
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