Avatar billede need4speed Nybegynder
22. august 2002 - 13:20 Der er 13 kommentarer og
1 løsning

Menu

Jeg leder efter en menu gerne magen til head.com når man går ind under tennis, der har de en fed menu.
Avatar billede easysoft_studios Nybegynder
22. august 2002 - 13:21 #1
det er en rimlig alm. javascript menu, med en masse css på...
Avatar billede need4speed Nybegynder
22. august 2002 - 13:22 #2
Ok hvis den er så simpel, så kan du vel hjælpe mig.
Avatar billede easysoft_studios Nybegynder
22. august 2002 - 13:24 #3
hehe, tja
Avatar billede need4speed Nybegynder
22. august 2002 - 13:26 #4
Næh.. vel så nem er den ikke, medmindre man er java haj.
Avatar billede dmdisco Nybegynder
22. august 2002 - 13:28 #5
jeg har den her liggende hvis det er sådan noget du er ude efter

<style>
<!--
DIV.clTop{position:absolute; width:170}
DIV.clSub{position:absolute; left:10; width:170}
#divCont{position:relative; left:100; top:0; 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 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+.

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

/************************************************************************************
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()
            }
            for(i=1;i<oTop.length;i++){
                oTop[i].moveIt(0,oTop[i-1].y+oTop[i-1].height)
            }
        }
        oSub[num].vis()?oSub[num].showIt():oSub[num].hideIt()
        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">
<!--************************************************************************************
Replace your links with the # inside the a tags to get links.
************************************************************************************-->
<div id="divCont">
    <div id="divTop1" class="clTop"><a href="#" onclick="menu(0); return false" class="clMain">[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">[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">[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">[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">[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">[choice 5]</a><br>
        <div id="divSub6" class="clSub">
            <a href="#" class="clSubb">-Sub 1</a><br>
        </div><br>
    </div>
</div>
Avatar billede need4speed Nybegynder
22. august 2002 - 14:03 #6
Jeg kan da lige teste den, så finder vi udaf det.
Avatar billede need4speed Nybegynder
22. august 2002 - 14:05 #7
Men hvis jeg kan få til at ligne den anden, så får du pointene.
Avatar billede need4speed Nybegynder
22. august 2002 - 14:11 #8
Ser meget gerne et andet forslag.. storset umuligt at rette til.
Avatar billede dmdisco Nybegynder
22. august 2002 - 14:12 #9
har du kigget inde på www.dhtmlcentral.com om de har en menu der passer
Avatar billede need4speed Nybegynder
22. august 2002 - 14:16 #10
Næh.. det har jeg ikke, men vil da ligge kigge.
Avatar billede dhunters Nybegynder
22. august 2002 - 19:45 #11
Du kan prøve at finde en treemenu. Lav en hel masse af dem og sæt dem derefter under hinanden. Du kan evt. også lave noget css med de forskellige punkter.
Avatar billede henni80 Nybegynder
22. august 2002 - 19:53 #12
Check evt. disse dropdown menu'er de skulle ikke være så svære at rette til, hvis ellers man er villig til at bruger lidt tid på dem.

I øvrigt er der lavet forlaringer til stort set det hele, så det skulle være lige til at gå til. :-)

http://www.simplythebest.net/scripts/dhtml_script_89.html
http://www.simplythebest.net/info/dhtmscript52.html
http://www.simplythebest.net/scripts/dhtml_script_91.html
http://www.simplythebest.net/scripts/dhtml_script_98.html
Avatar billede need4speed Nybegynder
22. august 2002 - 22:42 #13
i kommer nok til at dele pointene som det ser ud nu.
Avatar billede henni80 Nybegynder
22. august 2002 - 23:18 #14
Her tror jeg du kan finde den menu som du har brug for:

http://www.simplythebest.net/info/dhtmscript15.html

Havde misforstået spg. før og sat en række links til diverse dropdown menu'er, men det var nok nærmere dette du havde brug for.
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