Avatar billede flashit Nybegynder
07. marts 2001 - 14:09 Der er 7 kommentarer og
2 løsninger

Bratta menu

Hej Eksperter

Jeg har hentet følgende script hos Brette.
Det er helt fint, men jeg kunne godt tænke mig et menupunkt som IKKE indeholder et undermenupunkt.
Kan i se en løsning på dette problem?

Her er koden:

<html>
<head>
    <title>Cross-browser Dynamic HTML Scripts - FoldoutMenu</title>
<style type=\"text/css\">
DIV.clTop{position:absolute; width:170}
DIV.clSub{position:absolute; left:10; width:170}
#divCont{position:relative; visibility:hidden; left:80; top:-70; height:400; width:170;}
A.clMain{font-family:Arial, Verdana, Helvetica, Helv; font-size:14px; text-decoration:none; font-weight:bold; color:black}
A.clSubb{font-family:Arial, Verdana, Helvetica, Helv; font-size:14px; text-decoration:none; color:black}
#divMain{position:absolute}
</style>
<script type=\"text/javascript\" 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!
I will also appriciate any links you could give me.
********************************************************************************/
//Default browsercheck, added to all scripts!
function checkBrowser(){
    this.ver=navigator.appVersion
    this.dom=document.getElementById?1:0
    this.ie5=(this.ver.indexOf(\"MSIE 5\")>-1 && this.dom)?1:0;
    this.ie4=(document.all && !this.dom)?1:0;
    this.ns5=(this.dom && parseInt(this.ver) >= 5) ?1:0;
    this.ns4=(document.layers && !this.dom)?1:0;
    this.bw=(this.ie5 || this.ie4 || this.ns4 || this.ns5)
    return this
}
bw=new checkBrowser()
/************************************************************************************
This script is a \"foldout\" menu script, all the \"foldouts\" will
stay outfolded in older browsers. Works in ie4 and ie5 and ns4.
The next version will work in Netscape 5 as well...

There\'s only one version of this script now, and you can choose
whether you want images or not.

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

//Do you want images (if not set to 0 and remove the images from the body)?
foldImg=1

//This is the image that it changes to when it expands.
var exImg=new Image(); exImg.src=\'images/arrow1.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=\'images/arrow.gif\'

/************************************************************************************
Making cross-browser objects
************************************************************************************/
function makeMenu(obj,nest){
    nest=(!nest) ? \'\':\'document.\'+nest+\'.\'                                       
      this.css=bw.dom? document.getElementById(obj).style:bw.ie4?document.all[obj].style:bw.ns4?eval(nest+\"document.layers.\" +obj):0;       
    this.el=bw.dom?document.getElementById(obj):bw.ie4?document.all[obj]:bw.ns4?eval(nest+\'document.\'+obj):0;   
    this.ref=bw.dom || bw.ie4? document:bw.ns4?eval(nest+\"document.layers.\" +obj+\".document\"):0;       
    this.x=(bw.ns4 || bw.ns5)? this.css.left:this.css.pixelLeft;
    this.y=(bw.ns4 || bw.ns5)? this.css.top:this.css.pixelTop;       
    this.height=bw.ns4?this.ref.height:this.el.offsetHeight;       
    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) }
      oCont=new makeMenu(\'divCont\')
      oCont.showIt()
}
/************************************************************************************
This is the function that changes the sub menus to folded or unfolded state.
************************************************************************************/
function menu(num){
    if(bw.bw){
        if(!stayFolded){
            for(i=0;i<oSub.length;i++){
                if(i!=num){
                    oSub[i].hideIt()
                    if(foldImg)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()
            if(foldImg)oTop[num].ref[\"imgA\"+num].src=exImg.src
        }else{
            oSub[num].hideIt()
            if(foldImg)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(bw.bw) onload=init;

</script>
</HEAD>
<BODY bgcolor=\"White\">
<div id=\"divCont\">
    <div id=\"divTop1\" class=\"clTop\"><a href=\"#\" onclick=\"menu(0); return false\" class=\"clMain\"><img src=\"images/arrow.gif\" name=\"imgA0\" width=12 height=12 alt=\"\" border=\"0\"> [choice 0]</a><br>
        <div id=\"divSub1\" class=\"clSub\">
            <a href=\"#\" class=\"clSubb\">-Sub 1</a><br>
            <a href=\"#\" class=\"clSubb\">-Sub 2</a><br>
            <a href=\"#\" class=\"clSubb\">-Sub 3</a><br>
            <a href=\"#\" class=\"clSubb\">-Sub 4</a><br>
        </div><br>
    </div>
    <div id=\"divTop2\" class=\"clTop\"><a href=\"#\" onclick=\"menu(1); return false\" class=\"clMain\"><img src=\"images/arrow.gif\" name=\"imgA1\" width=12 height=12 alt=\"\" border=\"0\"> [choice 1]</a><br>
        <div id=\"divSub2\" class=\"clSub\">
            <a href=\"#\" class=\"clSubb\">-Sub 1</a><br>
            <a href=\"#\" class=\"clSubb\">-Sub 2</a><br>
        </div><br>
    </div>
    <div id=\"divTop3\" class=\"clTop\"><a href=\"#\" onclick=\"menu(2); return false\" class=\"clMain\"><img src=\"images/arrow.gif\" name=\"imgA2\" width=12 height=12 alt=\"\" border=\"0\"> [choice 2]</a><br>
        <div id=\"divSub3\" class=\"clSub\">
            <a href=\"#\" class=\"clSubb\">-Sub 1</a><br>
            <a href=\"#\" class=\"clSubb\">-Sub 2</a><br>
            <a href=\"#\" class=\"clSubb\">-Sub 3</a><br>
        </div><br>
    </div>
    <div id=\"divTop4\" class=\"clTop\"><a href=\"\" onclick=\"menu(3); return false\" class=\"clMain\"><img src=\"images/arrow.gif\" name=\"imgA3\" width=12 height=12 alt=\"\" border=\"0\"> [choice 3]</a><br>
        <div id=\"divSub4\" class=\"clSub\">
            <a href=\"#\" class=\"clSubb\">-Sub 1</a><br>
            <a href=\"#\" class=\"clSubb\">-Sub 2</a><br>
        </div><br>
    </div>
    <div id=\"divTop5\" class=\"clTop\"><a href=\"\" onclick=\"menu(4); return false\" class=\"clMain\"><img src=\"images/arrow.gif\" name=\"imgA4\" width=12 height=12 alt=\"\" border=\"0\"> [choice 4]</a><br>
        <div id=\"divSub5\" class=\"clSub\">
            <a href=\"#\" class=\"clSubb\">-Sub 1</a><br>
            <a href=\"#\" class=\"clSubb\">-Sub 2</a><br>
            <a href=\"#\" class=\"clSubb\">-Sub 3</a><br>
            <a href=\"#\" class=\"clSubb\">-Sub 4</a><br>
            <a href=\"#\" class=\"clSubb\">-Sub 5</a><br>
        </div><br>
    </div>
    <div id=\"divTop6\" class=\"clTop\"><a href=\"\" onclick=\"menu(5); return false\" class=\"clMain\"><img src=\"images/arrow.gif\" name=\"imgA5\" width=12 height=12 alt=\"\" border=\"0\"> [choice 5]</a><br>
        <div id=\"divSub6\" class=\"clSub\">
            <a href=\"#\" class=\"clSubb\">-Sub 1</a><br>
        </div><br>
    </div>
</div>

YOUR REGULAR BODY CONTENT GOES IN HERE
</BODY>
</HTML>
Avatar billede barlach Nybegynder
07. marts 2001 - 14:25 #1
fjern feks 
oSub[5]=new makeMenu(\'divSub6\',\'divCont.document.divTop6\')

for at fjerne submenu fra pkt 5...??
Avatar billede engrob Nybegynder
07. marts 2001 - 14:34 #2
Hvis du vil fjerne submenuen på punkt 6 så prøv at ændre
oSub[5]=new makeMenu(\'divSub6\',\'divCont.document.divTop6\')
til
oSub[5]=new makeMenu(null,\'divCont.document.divTop6\')
og så skal du huske at slette
<div id=\"divSub6\" class=\"clSub\">
<a href=\"#\" class=\"clSubb\">-Sub 1</a><br>
</div>
Avatar billede flashit Nybegynder
08. marts 2001 - 16:08 #3
Har i afprøvet jeres svar/kommentar?

Jeg kan nemlig ikke fjerne det, uden at få  en fejl.
Avatar billede engrob Nybegynder
08. marts 2001 - 17:25 #4
Hvad er fejlen?
Avatar billede johnnyk Nybegynder
08. marts 2001 - 17:55 #5
Hej!
Prøv at fjerne både konstruktøren til \"oSub[5]\" og layeret \"divSub6\"!
/Johnny
Avatar billede flashit Nybegynder
09. marts 2001 - 12:35 #6
Hej Igen

Jeg har prøvet følgende, men får denne fejl:

Et object er obligatorisk

Skal denne linie ikke ogsp rettes?
oTop[5]=new makeMenu(\'divTop6\',\'divCont\')



<html>
<head>
    <title>Cross-browser Dynamic HTML Scripts - FoldoutMenu</title>
<style type=\"text/css\">
DIV.clTop{position:absolute; width:170}
DIV.clSub{position:absolute; left:10; width:170}
#divCont{position:relative; visibility:hidden; left:80; top:-70; height:400; width:170;}
A.clMain{font-family:Arial, Verdana, Helvetica, Helv; font-size:14px; text-decoration:none; font-weight:bold; color:black}
A.clSubb{font-family:Arial, Verdana, Helvetica, Helv; font-size:14px; text-decoration:none; color:black}
#divMain{position:absolute}
</style>
<script type=\"text/javascript\" 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!
I will also appriciate any links you could give me.
********************************************************************************/
//Default browsercheck, added to all scripts!
function checkBrowser(){
    this.ver=navigator.appVersion
    this.dom=document.getElementById?1:0
    this.ie5=(this.ver.indexOf(\"MSIE 5\")>-1 && this.dom)?1:0;
    this.ie4=(document.all && !this.dom)?1:0;
    this.ns5=(this.dom && parseInt(this.ver) >= 5) ?1:0;
    this.ns4=(document.layers && !this.dom)?1:0;
    this.bw=(this.ie5 || this.ie4 || this.ns4 || this.ns5)
    return this
}
bw=new checkBrowser()
/************************************************************************************
This script is a \"foldout\" menu script, all the \"foldouts\" will
stay outfolded in older browsers. Works in ie4 and ie5 and ns4.
The next version will work in Netscape 5 as well...

There\'s only one version of this script now, and you can choose
whether you want images or not.

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

//Do you want images (if not set to 0 and remove the images from the body)?
foldImg=1

//This is the image that it changes to when it expands.
var exImg=new Image(); exImg.src=\'images/arrow1.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=\'images/arrow.gif\'

/************************************************************************************
Making cross-browser objects
************************************************************************************/
function makeMenu(obj,nest){
    nest=(!nest) ? \'\':\'document.\'+nest+\'.\'                                       
      this.css=bw.dom? document.getElementById(obj).style:bw.ie4?document.all[obj].style:bw.ns4?eval(nest+\"document.layers.\" +obj):0;       
    this.el=bw.dom?document.getElementById(obj):bw.ie4?document.all[obj]:bw.ns4?eval(nest+\'document.\'+obj):0;   
    this.ref=bw.dom || bw.ie4? document:bw.ns4?eval(nest+\"document.layers.\" +obj+\".document\"):0;       
    this.x=(bw.ns4 || bw.ns5)? this.css.left:this.css.pixelLeft;
    this.y=(bw.ns4 || bw.ns5)? this.css.top:this.css.pixelTop;       
    this.height=bw.ns4?this.ref.height:this.el.offsetHeight;       
    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(null,\'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) }
      oCont=new makeMenu(\'divCont\')
      oCont.showIt()
}
/************************************************************************************
This is the function that changes the sub menus to folded or unfolded state.
************************************************************************************/
function menu(num){
    if(bw.bw){
        if(!stayFolded){
            for(i=0;i<oSub.length;i++){
                if(i!=num){
                    oSub[i].hideIt()
                    if(foldImg)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()
            if(foldImg)oTop[num].ref[\"imgA\"+num].src=exImg.src
        }else{
            oSub[num].hideIt()
            if(foldImg)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(bw.bw) onload=init;

</script>
</HEAD>
<BODY bgcolor=\"White\">
<div id=\"divCont\">
    <div id=\"divTop1\" class=\"clTop\"><a href=\"#\" onclick=\"menu(0); return false\" class=\"clMain\"><img src=\"images/arrow.gif\" name=\"imgA0\" width=12 height=12 alt=\"\" border=\"0\"> [choice 0]</a><br>
        <div id=\"divSub1\" class=\"clSub\">
            <a href=\"#\" class=\"clSubb\">-Sub 1</a><br>
            <a href=\"#\" class=\"clSubb\">-Sub 2</a><br>
            <a href=\"#\" class=\"clSubb\">-Sub 3</a><br>
            <a href=\"#\" class=\"clSubb\">-Sub 4</a><br>
        </div><br>
    </div>
    <div id=\"divTop2\" class=\"clTop\"><a href=\"#\" onclick=\"menu(1); return false\" class=\"clMain\"><img src=\"images/arrow.gif\" name=\"imgA1\" width=12 height=12 alt=\"\" border=\"0\"> [choice 1]</a><br>
        <div id=\"divSub2\" class=\"clSub\">
            <a href=\"#\" class=\"clSubb\">-Sub 1</a><br>
            <a href=\"#\" class=\"clSubb\">-Sub 2</a><br>
        </div><br>
    </div>
    <div id=\"divTop3\" class=\"clTop\"><a href=\"#\" onclick=\"menu(2); return false\" class=\"clMain\"><img src=\"images/arrow.gif\" name=\"imgA2\" width=12 height=12 alt=\"\" border=\"0\"> [choice 2]</a><br>
        <div id=\"divSub3\" class=\"clSub\">
            <a href=\"#\" class=\"clSubb\">-Sub 1</a><br>
            <a href=\"#\" class=\"clSubb\">-Sub 2</a><br>
            <a href=\"#\" class=\"clSubb\">-Sub 3</a><br>
        </div><br>
    </div>

    <div id=\"divTop4\" class=\"clTop\"><a href=\"\" onclick=\"menu(3); return false\" class=\"clMain\"><img src=\"images/arrow.gif\" name=\"imgA3\" width=12 height=12 alt=\"\" border=\"0\"> [choice 3]</a><br>
        <div id=\"divSub4\" class=\"clSub\">
            <a href=\"#\" class=\"clSubb\">-Sub 1</a><br>
            <a href=\"#\" class=\"clSubb\">-Sub 2</a><br>
        </div><br>
    </div>
    <div id=\"divTop5\" class=\"clTop\"><a href=\"\" onclick=\"menu(4); return false\" class=\"clMain\"><img src=\"images/arrow.gif\" name=\"imgA4\" width=12 height=12 alt=\"\" border=\"0\"> [choice 4]</a><br>
        <div id=\"divSub5\" class=\"clSub\">
            <a href=\"#\" class=\"clSubb\">-Sub 1</a><br>
            <a href=\"#\" class=\"clSubb\">-Sub 2</a><br>
            <a href=\"#\" class=\"clSubb\">-Sub 3</a><br>
            <a href=\"#\" class=\"clSubb\">-Sub 4</a><br>
            <a href=\"#\" class=\"clSubb\">-Sub 5</a><br>
        </div><br>
    </div>
    <div id=\"divTop6\" class=\"clTop\"><a href=\"\" onclick=\"menu(5); return false\" class=\"clMain\"><img src=\"images/arrow.gif\" name=\"imgA5\" width=12 height=12 alt=\"\" border=\"0\"> [choice 5]</a><br>
    <br>
    </div>
</div>

YOUR REGULAR BODY CONTENT GOES IN HERE
</BODY>
</HTML>
Avatar billede johnnyk Nybegynder
09. marts 2001 - 16:35 #7
Hej igen!
Fjern konstruktøren til oSub5 HELT - du skal jo ikke bruge det til noget! Du kan heller ikke lave et nyt objekt med null!
/Johnny
Avatar billede flashit Nybegynder
09. april 2001 - 13:38 #8
Det virker desværre ikke?

Men her er jeres P for forsøget.
Avatar billede johnnyk Nybegynder
09. april 2001 - 14:25 #9
Jeg ved ikke om jeg misforstod noget men prøv at paste det her og se om det ikke virker.

<html>
<head>
    <title>Cross-browser Dynamic HTML Scripts - FoldoutMenu</title>
<style type=\"text/css\">
DIV.clTop{position:absolute; width:170}
DIV.clSub{position:absolute; left:10; width:170}
#divCont{position:relative; visibility:hidden; left:80; top:-70; height:400; width:170;}
A.clMain{font-family:Arial, Verdana, Helvetica, Helv; font-size:14px; text-decoration:none; font-weight:bold; color:black}
A.clSubb{font-family:Arial, Verdana, Helvetica, Helv; font-size:14px; text-decoration:none; color:black}
#divMain{position:absolute}
</style>
<script type=\"text/javascript\" 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!
I will also appriciate any links you could give me.
********************************************************************************/
//Default browsercheck, added to all scripts!
function checkBrowser(){
    this.ver=navigator.appVersion
    this.dom=document.getElementById?1:0
    this.ie5=(this.ver.indexOf(\"MSIE 5\")>-1 && this.dom)?1:0;
    this.ie4=(document.all && !this.dom)?1:0;
    this.ns5=(this.dom && parseInt(this.ver) >= 5) ?1:0;
    this.ns4=(document.layers && !this.dom)?1:0;
    this.bw=(this.ie5 || this.ie4 || this.ns4 || this.ns5)
    return this
}
bw=new checkBrowser()
/************************************************************************************
This script is a \"foldout\" menu script, all the \"foldouts\" will
stay outfolded in older browsers. Works in ie4 and ie5 and ns4.
The next version will work in Netscape 5 as well...

There\'s only one version of this script now, and you can choose
whether you want images or not.

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

//Do you want images (if not set to 0 and remove the images from the body)?
foldImg=1

//This is the image that it changes to when it expands.
var exImg=new Image(); exImg.src=\'images/arrow1.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=\'images/arrow.gif\'

/************************************************************************************
Making cross-browser objects
************************************************************************************/
function makeMenu(obj,nest){
    nest=(!nest) ? \'\':\'document.\'+nest+\'.\'                                       
      this.css=bw.dom? document.getElementById(obj).style:bw.ie4?document.all[obj].style:bw.ns4?eval(nest+\"document.layers.\" +obj):0;       
    this.el=bw.dom?document.getElementById(obj):bw.ie4?document.all[obj]:bw.ns4?eval(nest+\'document.\'+obj):0;   
    this.ref=bw.dom || bw.ie4? document:bw.ns4?eval(nest+\"document.layers.\" +obj+\".document\"):0;       
    this.x=(bw.ns4 || bw.ns5)? this.css.left:this.css.pixelLeft;
    this.y=(bw.ns4 || bw.ns5)? this.css.top:this.css.pixelTop;       
    this.height=bw.ns4?this.ref.height:this.el.offsetHeight;       
    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\')


///////////////////////////////////////////////////////////////
//
//  Hvis du ikke vil have undermenuer ud for [choice 5] f.eks., 
//  så kan du bare fjerne de enkelte undermenu-objekter
//  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) }
      oCont=new makeMenu(\'divCont\')
      oCont.showIt()
}
/************************************************************************************
This is the function that changes the sub menus to folded or unfolded state.
************************************************************************************/
function menu(num){
    if(bw.bw){
        if(!stayFolded){
            for(i=0;i<oSub.length;i++){
                if(i!=num){
                    oSub[i].hideIt()
                    if(foldImg)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()
            if(foldImg)oTop[num].ref[\"imgA\"+num].src=exImg.src
        }else{
            oSub[num].hideIt()
            if(foldImg)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(bw.bw) onload=init;

</script>
</HEAD>
<BODY bgcolor=\"White\">
<div id=\"divCont\">
    <div id=\"divTop1\" class=\"clTop\"><a href=\"#\" onclick=\"menu(0); return false\" class=\"clMain\"><img src=\"images/arrow.gif\" name=\"imgA0\" width=12 height=12 alt=\"\" border=\"0\"> [choice 0]</a><br>
        <div id=\"divSub1\" class=\"clSub\">
            <a href=\"#\" class=\"clSubb\">-Sub 1</a><br>
            <a href=\"#\" class=\"clSubb\">-Sub 2</a><br>
            <a href=\"#\" class=\"clSubb\">-Sub 3</a><br>
            <a href=\"#\" class=\"clSubb\">-Sub 4</a><br>
        </div><br>
    </div>
    <div id=\"divTop2\" class=\"clTop\"><a href=\"#\" onclick=\"menu(1); return false\" class=\"clMain\"><img src=\"images/arrow.gif\" name=\"imgA1\" width=12 height=12 alt=\"\" border=\"0\"> [choice 1]</a><br>
        <div id=\"divSub2\" class=\"clSub\">
            <a href=\"#\" class=\"clSubb\">-Sub 1</a><br>
            <a href=\"#\" class=\"clSubb\">-Sub 2</a><br>
        </div><br>
    </div>
    <div id=\"divTop3\" class=\"clTop\"><a href=\"#\" onclick=\"menu(2); return false\" class=\"clMain\"><img src=\"images/arrow.gif\" name=\"imgA2\" width=12 height=12 alt=\"\" border=\"0\"> [choice 2]</a><br>
        <div id=\"divSub3\" class=\"clSub\">
            <a href=\"#\" class=\"clSubb\">-Sub 1</a><br>
            <a href=\"#\" class=\"clSubb\">-Sub 2</a><br>
            <a href=\"#\" class=\"clSubb\">-Sub 3</a><br>
        </div><br>
    </div>
    <div id=\"divTop4\" class=\"clTop\"><a href=\"\" onclick=\"menu(3); return false\" class=\"clMain\"><img src=\"images/arrow.gif\" name=\"imgA3\" width=12 height=12 alt=\"\" border=\"0\"> [choice 3]</a><br>
        <div id=\"divSub4\" class=\"clSub\">
            <a href=\"#\" class=\"clSubb\">-Sub 1</a><br>
            <a href=\"#\" class=\"clSubb\">-Sub 2</a><br>
        </div><br>
    </div>
    <div id=\"divTop5\" class=\"clTop\"><a href=\"\" onclick=\"menu(4); return false\" class=\"clMain\"><img src=\"images/arrow.gif\" name=\"imgA4\" width=12 height=12 alt=\"\" border=\"0\"> [choice 4]</a><br>
        <div id=\"divSub5\" class=\"clSub\">
            <a href=\"#\" class=\"clSubb\">-Sub 1</a><br>
            <a href=\"#\" class=\"clSubb\">-Sub 2</a><br>
            <a href=\"#\" class=\"clSubb\">-Sub 3</a><br>
            <a href=\"#\" class=\"clSubb\">-Sub 4</a><br>
            <a href=\"#\" class=\"clSubb\">-Sub 5</a><br>
        </div><br>
    </div>
    <div id=\"divTop6\" class=\"clTop\"><a href=\"\" onclick=\"menu(5); return false\" class=\"clMain\"><img src=\"images/arrow.gif\" name=\"imgA5\" width=12 height=12 alt=\"\" border=\"0\"> [choice 5]</a><br>

<!--

        Dette lag indeholder undermenuen og den fjerner du så bare helt!


        <div id=\"divSub6\" class=\"clSub\">
            <a href=\"#\" class=\"clSubb\">-Sub 1</a><br>
        </div><br>

//-->
    </div>


</div>

YOUR REGULAR BODY CONTENT GOES IN HERE
</BODY>
</HTML>
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
Vi tilbyder markedets bedste kurser inden for webudvikling

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