Positionering i Netscape!
Jeg har lavet en side fordelt i to områder vha. en frame. I højre side vises indholdet og i venstre side en menu. Problemet med menuen er, at den i Explorer (5.0) er placeret korrekt, men med Netscape (4.08 tror jeg nok) er den placeret helt galt. Siden kan ses på http://home1.stofanet.dk/braun/test/frame.htm Nedenfor har jeg lagt koden for menu'en. Hvad skal jeg gøre for at menu'en bliver placeret på samme sted i både Explorer og Netscape? Jeg sætter 100 point til den, som kommer med en færdig løsning (som er brugbar). Her er koden for menu'en:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
<HTML>
<HEAD>
<TITLE>[Menu]</TITLE>
<META NAME="Generator" CONTENT="Stone's WebWriter 2">
<!-- Minus AutoDato -->
<style>
<!--
DIV.clTop{position:absolute; left:0; width:150}
DIV.clSub{position:absolute; left:10; width:150}
#divCont{position:relative; left:10; top:0; height:300; width:150;}
A.clMain{font-family:Arial, Verdana, Helvetica, Helv; font-size:12px; text-decoration:none; font-weight:bold; color:red}
A.clSubb{font-family:Arial, Verdana, Helvetica, Helv; font-size:12px; text-decoration:none; color:red;}
#divMain{position:absolute}
//-->
A:Visited {color:Red; text-decoration:none; font-size:12px;}
A:Active {color:Red; text-decoration:none; font-size:12px;}
A:Hover {color:Blue; text-decoration:none; font-size:12px;}
</style>
<script language="JavaScript">
/********************************************************************************
Copyright (C) 1999 Thomas Brattli
This script is made by and copyrighted to Thomas Brattli at www.bratta.com
Visit for more great scripts.
This may be used freely as long as this msg is intact!
********************************************************************************/
/************************************************************************************
This script is a "foldout" menu script, all the "foldouts" will
stay outfolded in older browsers. Works in ie4+ and ns4+.
ADDED: Images
To change where the menu appears change the left and top values of the divCont
in the stylesheets, it's currently placed relative so you can
place this menu in tables or similar if you want. Change the
text colors and size in the A.clMain and A.clSubb classes.
************************************************************************************/
/************************************************************************************
Change this to false if you want all the submenus to get unfold when you
foldout a new one.
************************************************************************************/
var stayFolded=false
//This is the image that it changes to when it expands.
var exImg=new Image(); exImg.src='nblw2.gif'
//This is the image is changes to with it's "unfolded" or something :}
//Remeber to change the actual images in the page aswell, but remember to
//keep the name of the image.
var unImg=new Image(); unImg.src='nblw1.gif'
/************************************************************************************
Browsercheck
************************************************************************************/
var n = (document.layers) ? 1:0;
var ie = (document.all) ? 1:0;
var browser=((n || ie) && parseInt(navigator.appVersion)>=4)
/************************************************************************************
Making cross-browser objects
************************************************************************************/
function makeMenu(obj,nest){
nest=(!nest) ? '':'document.'+nest+'.'
this.css=(n) ? eval(nest+'document.'+obj):eval('document.all.'+obj+'.style')
this.ref=(n) ? eval(nest+'document.'+obj+'.document'):eval('document');
this.height=n?this.ref.height:eval(obj+'.offsetHeight')
this.x=(n)? this.css.left:this.css.pixelLeft;this.y=(n)? this.css.top:this.css.pixelTop;
this.hideIt=b_hideIt; this.showIt=b_showIt; this.vis=b_vis; this.moveIt=b_moveIt
return this
}
function b_showIt(){this.css.visibility="visible"}
function b_hideIt(){this.css.visibility="hidden"}
function b_vis(){if(this.css.visibility=="hidden" || this.css.visibility=="hide") return true;}
function b_moveIt(x,y){this.x=x; this.y=y; this.css.left=this.x; this.css.top=this.y}
/************************************************************************************
Initiating the page. Just add to the arrays here to get more menuitems
and add divs in the page
************************************************************************************/
function init(){
oTop=new Array()
oTop[0]=new makeMenu('divTop1','divCont')
oTop[1]=new makeMenu('divTop2','divCont')
oTop[2]=new makeMenu('divTop3','divCont')
oTop[3]=new makeMenu('divTop4','divCont')
oTop[4]=new makeMenu('divTop5','divCont')
oTop[5]=new makeMenu('divTop6','divCont')
oSub=new Array()
oSub[0]=new makeMenu('divSub1','divCont.document.divTop1')
oSub[1]=new makeMenu('divSub2','divCont.document.divTop2')
oSub[2]=new makeMenu('divSub3','divCont.document.divTop3')
oSub[3]=new makeMenu('divSub4','divCont.document.divTop4')
oSub[4]=new makeMenu('divSub5','divCont.document.divTop5')
oSub[5]=new makeMenu('divSub6','divCont.document.divTop6')
for(i=0;i<oSub.length;i++){ oSub[i].hideIt() }
for(i=1;i<oTop.length;i++){ oTop[i].moveIt(0,oTop[i-1].y+oTop[i-1].height) }
}
/************************************************************************************
This is the function that changes the sub menus to folded or unfolded state.
************************************************************************************/
function menu(num){
if(browser){
if(!stayFolded){
for(i=0;i<oSub.length;i++){
if(i!=num){
oSub[i].hideIt()
oTop[i].ref["imgA"+i].src=unImg.src
}
}
for(i=1;i<oTop.length;i++){
oTop[i].moveIt(0,oTop[i-1].y+oTop[i-1].height)
}
}
if(oSub[num].vis()){
oSub[num].showIt()
oTop[num].ref["imgA"+num].src=exImg.src
}else{
oSub[num].hideIt()
oTop[num].ref["imgA"+num].src=unImg.src
}
for(i=1;i<oTop.length;i++){
if(!oSub[i-1].vis()) oTop[i].moveIt(0,oTop[i-1].y+oTop[i-1].height+oSub[i-1].height)
else oTop[i].moveIt(0,oTop[i-1].y+oTop[i-1].height)
}
}
}
//Initiating the menus onload, if it's a 4.x+ browser.
if(browser) onload=init;
</script>
</HEAD>
<BODY BGCOLOR="White" TEXT="Black" LINK="Blue" VLINK="#660066" ALINK="Red">
<TABLE BORDER="0" CELLSPACING="0" CELLPADDING="0">
<TR ALIGN="CENTER">
<TD BGCOLOR="Red"> </TD>
<TD BGCOLOR="Red"> </TD>
<TD BGCOLOR="Red"><FONT COLOR="White" SIZE="4" FACE="Helvetica,Impact">FC Skjoldhøgenes</FONT></TD>
<TD BGCOLOR="Red"> </TD>
<TD BGCOLOR="Red"> </TD>
<TD BGCOLOR="White"> </TD>
</TR>
<TR ALIGN="CENTER">
<TD BGCOLOR="Red"> </TD>
<TD BGCOLOR="Red"> </TD>
<TD BGCOLOR="Red"><FONT COLOR="White" SIZE="4" FACE="Helvetica,Impact">Hjemmeside</FONT></TD>
<TD BGCOLOR="Red"> </TD>
<TD BGCOLOR="Red"> </TD>
<TD BGCOLOR="White"> </TD>
</TR>
<TR ALIGN="CENTER">
<TD HEIGHT="8" BGCOLOR="Red"> </TD>
<TD HEIGHT="8" BGCOLOR="Red"> </TD>
<TD HEIGHT="8" BGCOLOR="Red"> </TD>
<TD HEIGHT="8" BGCOLOR="Red"> </TD>
<TD HEIGHT="8" VALIGN="BOTTOM" BGCOLOR="Red"><IMG SRC="br1.gif" BORDER="0" WIDTH="10" HEIGHT="8" ALIGN="BOTTOM" ALT=""></TD>
<TD HEIGHT="8" BGCOLOR="White"> </TD>
</TR>
<TR ALIGN="CENTER">
<TD BGCOLOR="Red"> </TD>
<TD VALIGN="TOP" BGCOLOR="White"><IMG SRC="xtl1.gif" BORDER="0" WIDTH="10" HEIGHT="8" ALIGN="TOP" ALT=""></TD>
<TD BGCOLOR="White"> </TD>
<TD BGCOLOR="White"> </TD>
<TD BGCOLOR="White"> </TD>
<TD BGCOLOR="White"> </TD>
</TR>
<TR>
<TD HEIGHT="285" BGCOLOR="Red"> </TD>
<TD HEIGHT="285" BGCOLOR="White"> </TD>
<!-- Menuen starter her -->
<TD HEIGHT="285" BGCOLOR="White">
<div id="divCont">
<div id="divTop1" class="clTop"><a href="#" onclick="menu(0); return false" class="clMain"><img src="nblw1.gif" name="imgA0" width=12 height=12 alt="" border="0"> [Klubben]</a><br>
<div id="divSub1" class="clSub">
<A HREF="forside.htm" TARGET="hovedramme" class="clSubb">Forside</A><br>
<A HREF="klubben.htm" TARGET="hovedramme" class="clSubb">Informationer om Klubben</A><br>
<a href="personer.htm#" TARGET="hovedramme" class="clSubb">Kontaktpersoner</a><br>
<a href="kontingent.htm" TARGET="hovedramme" class="clSubb">Kontingent</a><br><BR>
</div>
</div>
<div id="divTop2" class="clTop"><a href="#" onclick="menu(1); return false" class="clMain"><img src="nblw1.gif" name="imgA1" width=12 height=12 alt="" border="0"> [Resultater]</a><br>
<div id="divSub2" class="clSub">
<a href="http://resultater.infosport.dk/dbu/Display/k33.mml?rv1=P004946&fb=&ak=&rk=Serie+5%2C+Herrer&ugp=klubovs%2Emml%3Frv1%3D9355" TARGET="hovedramme" class="clSubb">Kampprogram 1. holdet</a><br>
<a href="http://resultater.infosport.dk/dbu/Display/stillng.mml?rv1=P004946&ugp=klubovs.mml?rv1=9355&rk=Serie+5%2C+Herrer&navn=Fc+Skjoldh%F8gene" TARGET="hovedramme" class="clSubb">Stilling 1. holdet</a><br>
<a href="http://resultater.infosport.dk/dbu/Display/k33.mml?rv1=P004999&fb=&ak=&rk=Serie+6%2C+Herrer&ugp=klubovs%2Emml%3Frv1%3D9355" TARGET="hovedramme" class="clSubb">Kampprogram 2. holdet</a><br>
<a href="http://resultater.infosport.dk/dbu/Display/stillng.mml?rv1=P004999&ugp=klubovs.mml?rv1=9355&rk=Serie+6%2C+Herrer&navn=Fc+Skjoldh%F8gene" TARGET="hovedramme" class="clSubb">Stilling 2. holdet</a><br>
<a href="1999-1.htm" TARGET="hovedramme" class="clSubb">Resultater 1. holdet 1999</a><br>
<a href="1999-2.htm" TARGET="hovedramme" class="clSubb">Resultater 2. holdet 1999</a><br>
<A HREF="1998-1.htm" TARGET="hovedramme" class="clSubb">Resultater 1. holdet 1998</A><br>
<a href="1998-2.htm" TARGET="hovedramme" class="clSubb">Resultater 2. holdet 1998</a><br>
<A HREF="kampref.htm" TARGET="hovedramme" class="clSubb">Kampreferater</A><br>
<a href="topscor.htm" TARGET="hovedramme" class="clSubb">Topscorerliste</a><br><BR>
</div>
</div>
<div id="divTop3" class="clTop"><a href="#" onclick="menu(2); return false" class="clMain"><img src="nblw1.gif" name="imgA2" width=12 height=12 alt="" border="0"> [FCS Support]</a><br>
<div id="divSub3" class="clSub">
<a href="support.htm" TARGET="hovedramme" class="clSubb">Medlemmer</a><br>
<a href="tilmeld.htm" TARGET="hovedramme" class="clSubb">Tilmelding</a><br>
<a href="billeder.htm" TARGET="hovedramme" class="clSubb">Billeder</a><br>
<a href="sange.htm" TARGET="hovedramme" class="clSubb">Sange</a><br>
<a href="download.htm" TARGET="hovedramme" class="clSubb">Download</a><br><BR>
</div>
</div>
<div id="divTop4" class="clTop"><a href="" onclick="menu(3); return false" class="clMain"><img src="nblw1.gif" name="imgA3" width=12 height=12 alt="" border="0"> [Kontakt Os]</a><br>
<div id="divSub4" class="clSub">
<a href="personer.htm" TARGET="hovedramme" class="clSubb">Kontaktpersoner</a><br>
<a href="http://www.freeguestbooks.com/cgi-bin/view.pl?fcs" TARGET="hovedramme" class="clSubb">Gæstebog</a><br>
<a href="email.htm" TARGET="hovedramme" class="clSubb">Email</a><br>
<a href="mailing.htm" TARGET="hovedramme" class="clSubb">Mailingliste</a><br><BR>
</div>
</div>
<div id="divTop5" class="clTop"><a href="" onclick="menu(4); return false" class="clMain"><img src="nblw1.gif" name="imgA4" width=12 height=12 alt="" border="0"> [Diverse]</a><br>
<div id="divSub5" class="clSub">
<a href="Vitser.htm" TARGET="hovedramme" class="clSubb">Vitser</a><br>
<A HREF="awards.htm" TARGET="hovedramme" class="clSubb">Awards Side 1</A><br>
<A HREF="awards2.htm" TARGET="hovedramme" class="clSubb">Awards Side 2</A><br>
<A HREF="awards3.htm" TARGET="hovedramme" class="clSubb">Awards Side 3</A><br>
<A HREF="awards4.htm" TARGET="hovedramme" class="clSubb">Awards Side 4</A><br><BR>
</div>
</div>
<div id="divTop6" class="clTop"><a href="" onclick="menu(5); return false" class="clMain"><img src="nblw1.gif" name="imgA5" width=12 height=12 alt="" border="0"> [Links]</a><br>
<div id="divSub6" class="clSub">
<a href="dalinks.htm" TARGET="hovedramme" class="clSubb">Danske Links</a><br>
<a href="englinks.htm" TARGET="hovedramme" class="clSubb">Engelske Links</a><br>
<a href="spalinks.htm" TARGET="hovedramme" class="clSubb">Spanske Links</a><br>
<a href="italinks.htm" TARGET="hovedramme" class="clSubb">Italienske Links</a><br>
<a href="tylinks.htm" TARGET="hovedramme" class="clSubb">Tyske Links</a><br>
<a href="fralinks.htm" TARGET="hovedramme" class="clSubb">Franske Links</a><br>
<a href="skolinks.htm" TARGET="hovedramme" class="clSubb">Skotske Links</a><br>
<a href="hollinks.htm" TARGET="hovedramme" class="clSubb">Hollandske Links</a><br>
<a href="uslinks.htm" TARGET="hovedramme" class="clSubb">Amerikanske Links</a><br>
<a href="divlinks.htm" TARGET="hovedramme" class="clSubb">Internationale Links</a><br>
<a href="tekstlink.htm" TARGET="hovedramme" class="clSubb">Alle links i Tekstformat</a><br><BR>
</div>
</div>
</div>
</TD>
<!-- Menuen slutter her -->
<TD HEIGHT="285" BGCOLOR="White"> </TD>
<TD HEIGHT="285" BGCOLOR="White"> </TD>
<TD HEIGHT="285" BGCOLOR="White"> </TD>
</TR>
<TR ALIGN="CENTER">
<TD HEIGHT="8" BGCOLOR="Red"> </TD>
<TD VALIGN="BOTTOM" HEIGHT="8" BGCOLOR="White"><IMG SRC="xbl1.gif" BORDER="0" WIDTH="10" HEIGHT="8" ALIGN="TOP" ALT=""></TD>
<TD HEIGHT="8" BGCOLOR="White"> </TD>
<TD HEIGHT="8" BGCOLOR="White"> </TD>
<TD HEIGHT="8" BGCOLOR="White"> </TD>
<TD HEIGHT="8" BGCOLOR="White"> </TD>
</TR>
<TR ALIGN="CENTER">
<TD HEIGHT="8" BGCOLOR="Red"> </TD>
<TD HEIGHT="8" BGCOLOR="Red"> </TD>
<TD HEIGHT="8" BGCOLOR="Red"> </TD>
<TD HEIGHT="8" BGCOLOR="Red"> </TD>
<TD VALIGN="TOP" HEIGHT="8" BGCOLOR="Red"><IMG SRC="toprightud.gif" BORDER="0" WIDTH="10" HEIGHT="8" ALIGN="TOP" ALT=""></TD>
<TD HEIGHT="8" BGCOLOR="White"> </TD>
</TR>
<TR ALIGN="CENTER">
<TD HEIGHT="8" BGCOLOR="Red"> </TD>
<TD VALIGN="TOP" HEIGHT="8" BGCOLOR="White"><IMG SRC="xtl1.gif" BORDER="0" WIDTH="10" HEIGHT="8" ALIGN="TOP" ALT=""></TD>
<TD HEIGHT="8" BGCOLOR="White"> </TD>
<TD VALIGN="TOP" HEIGHT="8" BGCOLOR="White"><IMG SRC="xtr1.gif" BORDER="0" WIDTH="10" HEIGHT="8" ALIGN="TOP" ALT=""></TD>
<TD HEIGHT="8" BGCOLOR="Red"> </TD>
<TD HEIGHT="8" BGCOLOR="White"> </TD>
</TR>
<TR ALIGN="CENTER">
<TD BGCOLOR="Red"> </TD>
<TD BGCOLOR="White"> </TD>
<TD BGCOLOR="White"><CENTER><IMG SRC="FCS_LOGO(lille).gif" BORDER="0" WIDTH="105" HEIGHT="146" ALIGN="BOTTOM" ALT="Lille FCS-logo"></CENTER></TD>
<TD BGCOLOR="White"> </TD>
<TD BGCOLOR="Red"> </TD>
<TD BGCOLOR="White"> </TD>
</TR>
<TR ALIGN="CENTER">
<TD HEIGHT="8" BGCOLOR="Red"> </TD>
<TD VALIGN="BOTTOM" HEIGHT="8" BGCOLOR="White"><IMG SRC="xbl1.gif" BORDER="0" WIDTH="10" HEIGHT="8" ALIGN="BOTTOM" ALT=""></TD>
<TD HEIGHT="8" BGCOLOR="White"> </TD>
<TD VALIGN="BOTTOM" HEIGHT="8" BGCOLOR="White"><IMG SRC="xbr1.gif" BORDER="0" WIDTH="10" HEIGHT="8" ALIGN="BOTTOM" ALT=""></TD>
<TD HEIGHT="8" BGCOLOR="Red"> </TD>
<TD HEIGHT="8" BGCOLOR="White"> </TD>
</TR>
<TR ALIGN="CENTER">
<TD HEIGHT="8" BGCOLOR="Red"> </TD>
<TD HEIGHT="8" BGCOLOR="Red"> </TD>
<TD HEIGHT="8" BGCOLOR="Red"> </TD>
<TD HEIGHT="8" BGCOLOR="Red"> </TD>
<TD VALIGN="BOTTOM" HEIGHT="8" BGCOLOR="Red"><IMG SRC="br1.gif" BORDER="0" WIDTH="10" HEIGHT="8" ALIGN="BOTTOM" ALT=""></TD>
<TD HEIGHT="8" BGCOLOR="White"></TD>
</TR>
</TABLE>
</BODY>
</HTML>
