Avatar billede mora Nybegynder
24. september 1999 - 10:30 Der er 17 kommentarer og
1 løsning

menu

Er der ikke nogen der ved hvordan jeg kan have en linje med hovedlinks, som ved mouseOver viser en lille "popup" menu(ikke i nyt vindue), som man så kan vælge et underpunkt fra?
Avatar billede kermit Nybegynder
24. september 1999 - 10:36 #1
Du kan prøve at tjekke sovsen på denne site:

http://www.monogram.dk/

Avatar billede pingo Nybegynder
24. september 1999 - 10:37 #2
Du er vanvittigt nærrige med dine points...
Avatar billede Slettet bruger
24. september 1999 - 10:56 #3
<html>

<head>

<title>Menu</title>
<style>
<!--.nu {text-decoration: none; font-family:Arial;}
    A:link {text-decoration: none; color: #00ff00 }
    A:visited {text-decoration: none; color: #00ff00 }
    A:hover {text-decoration: none; color: #ff0000}  -->
</style>
</head>

<body background="#" text="#" link="#" vlink="#"
alink="#">

<table border="10" width="180" cellspacing="0" bordercolor="#FF0033" bordercolorlight="#009933" bordercolordark="#006633" cellpadding="0"
height="304">

<Br>
<tr>
    <td width="180" bgcolor="#ffffff" height="24"><p align="center">
    <Font face="Comic sans MS">
    <strong>Menu</strong></a></font></td>
  </tr>

<tr>
    <td width="180" bgcolor="#000000" height="18"><p align="center">
    <font face="Times new Roman"><a href="../stab/stab.htm" style="text-decoration: none"
    OnMouseOver="window.status='Ved du ikke hvem vi er ???? så klik her !' ; return true"  target="MAIN"
    <small><strong>Staben</strong></small></a></font></td>
  </tr>
 
<tr>
    <td width="180" bgcolor="#000000" height="18"><p align="center">
    <font face="Times new Roman"><a href="../aarpro/pro99_00.htm"style="text-decoration: none"
    OnMouseOver="window.status='Årskalenderen jaahh så kan du se hvad der sker i divisionen' ; return true" target="MAIN"
    <small><strong>Årskalender</strong></small></a></font></td>
  </tr>
 
<tr>
    <td width="180" bgcolor="#000000" height="18"><p align="center">
    <font face="Times new Roman"><a href="../meddel/no.htm"style="text-decoration: none"
    OnMouseOver="window.status='Billeder, placeringer og meget andet er at finde her !' ; return true" target="MAIN"
    <small><strong>Divisions mesterskaber</strong></small></a></font></td>
  </tr>

<tr>
    <td width="180" bgcolor="#000000" height="18"><p align="center">
    <font face="Times new Roman"><a href="../meddel/no.htm"style="text-decoration: none"
    OnMouseOver="window.status='Referater af møder' ; return true" target="MAIN"
    <small><strong>Møder og referater</strong></small></a></font></td>
  </tr>

<tr>
    <td width="180" bgcolor="#000000" height="18"><p align="center">
    <font face="Times new Roman"><a href="../meddel/no.htm"style="text-decoration: none"
    OnMouseOver="window.status='Hvor mange spejdere er der i divisionen' ; return true" target="MAIN"
    <small><strong>Medlems oversigt</strong></small></a></font></td>
  </tr>

<tr>
    <td width="180" bgcolor="#000000" height="18"><p align="center">
    <font face="Times new Roman"><a href="../meddel/nyt.htm"style="text-decoration: none"
    OnMouseOver="window.status='Hvad er det sidste nye der er sket i divisionen' ; return true" target="MAIN"
    <small><strong>Nyheder i divisionen</strong></small></a></font></td>
  </tr>

<tr>
    <td width="180" bgcolor="#000000" height="18"><p align="center">
    <font face="Times new Roman"><a href="../meddel/no.htm"style="text-decoration: none"
    OnMouseOver="window.status='Her kan du besøge de andre grupper i divisionen' ; return true" target="MAIN"
    <small><strong>Grupper i divisionen</strong></small></a></font></td>
  </tr>
 
<tr>
    <td width="180" bgcolor="#000000" height="18"><p align="center">
    <font face="Times new Roman"><a href="../meddel/no.htm"style="text-decoration: none" OnMouseOver="window.status='Link til andre spændende steder !' ; return true" target="MAIN"
    <small><strong>Link</strong></small>
    </a></font></td>
</tr>

<tr>
    <td width="180" bgcolor="#000000" height="18"><p align="center">
    <font face="Times new Roman"><a href="../master/master.htm"style="text-decoration: none" OnMouseOver="window.status='Webmaster at this site Henning Jeppesen' ; return true" target="MAIN"
    <small><strong><Font color="#FF0000">B<Font color="#FF3300">e<Font color="#FF6600">s<Font color="#FF9900">ø<Font color="#FFCC00">g <Font color="#FF9900">W<Font color="#FF6600">e<Font color="#FF3300">b<Font color="#FF0000">m<Font color="#FF3300">a<Font color="#FF6600">s<Font color="#FF6600">t<Font color="#FF9900">e<Font color="#FFCC00">r</strong></small>
    </a></font></td>
</table>
<Font Color="Black" Face="Times New Roman" Size="2">
Siden ses bedst med:<Br>
IE 4.0 eller højere<Br>
Opløsning 800*600<Br>
</body>
</html>

Denne her er her fra Eksperten og hvis du har lidt forstand på HTML lurer du hurtigt hvordan du ændre den !

:-) Henning
Avatar billede mora Nybegynder
24. september 1999 - 10:57 #4
heftig kode, er du frisk på at lave den om til mig?

Hovedpunkter:
1: Telefoni
2: Reklame
3: Kontakt
4: Diverse
5: Tak til

Underpunkter til 1:
Fastnet: fastnet.htm
Mobil: mobil.htm
Internet: internet.htm
Internationalt: int.htm

Underpunkter til 2:
Links: info.htm
Reklame info: ad_info.htm

Underpunkter til 3:
Kontakt webmaster: mail.htm
Mail-liste: mail_liste.htm

Underpunkter til 4:
Vejledning: vejled.htm
Vuderinger: mening.htm
Støt denne side: doner.htm
Bruger afstemninger: bruger.htm

Underpunkter til 5:
der er ingen underpunkter, dette skal være et direkte link til tak_fast.htm og hele koden til denne del skal være omfattet af en kommentar (så jeg let kan slette den igen om ca. en uge)
Avatar billede mora Nybegynder
24. september 1999 - 10:57 #5
der er 250 points at hente, på at tilpasse den
Avatar billede skjoldby Nybegynder
24. september 1999 - 11:02 #6
Avatar billede Slettet bruger
24. september 1999 - 11:04 #7
<html>

<head>

<title>Menu</title>
<style>
<!--.nu {text-decoration: none; font-family:Arial;}
    A:link {text-decoration: none; color: #00ff00 }
    A:visited {text-decoration: none; color: #00ff00 }
    A:hover {text-decoration: none; color: #ff0000}  -->
</style>
</head>

<body background="#" text="#" link="#" vlink="#"
alink="#">

<table border="10" width="180" cellspacing="0" bordercolor="#FF0033" bordercolorlight="#009933" bordercolordark="#006633" cellpadding="0"
height="304">

<Br>
<tr>
    <td width="180" bgcolor="#ffffff" height="24"><p align="center">
    <Font face="Comic sans MS">
    <strong>Menu</strong></a></font></td>
  </tr>

<tr>
    <td width="180" bgcolor="#000000" height="18"><p align="center">
    <font face="Times new Roman"><a href="        " style="text-decoration: none"
    OnMouseOver="window.status='Telefoni' ; return true"  target="MAIN"
    <small><strong>Telefoni</strong></small></a></font></td>
  </tr>
 
<tr>
    <td width="180" bgcolor="#000000" height="18"><p align="center">
    <font face="Times new Roman"><a href="        "style="text-decoration: none"
    OnMouseOver="window.status='Reklame' ; return true" target="MAIN"
    <small><strong>Reklame</strong></small></a></font></td>
  </tr>
 
<tr>
    <td width="180" bgcolor="#000000" height="18"><p align="center">
    <font face="Times new Roman"><a href="        "style="text-decoration: none"
    OnMouseOver="window.status='Kontakt' ; return true" target="MAIN"
    <small><strong>Kontakt</strong></small></a></font></td>
  </tr>

<tr>
    <td width="180" bgcolor="#000000" height="18"><p align="center">
    <font face="Times new Roman"><a href="        "style="text-decoration: none"
    OnMouseOver="window.status='Diverse' ; return true" target="MAIN"
    <small><strong>Diverse</strong></small></a></font></td>
  </tr>

<tr>
    <td width="180" bgcolor="#000000" height="18"><p align="center">
    <font face="Times new Roman"><a href="        "style="text-decoration: none"
    OnMouseOver="window.status='Tak til' ; return true" target="MAIN"
    <small><strong>Tak til</strong></small></a></font></td>
  </tr>

</table>
<Font Color="Black" Face="Times New Roman" Size="2">
Siden ses bedst med:<Br>
IE 4.0 eller højere<Br>
Opløsning 800*600<Br>
</body>
</html>
Avatar billede Slettet bruger
24. september 1999 - 11:06 #8
Jeg kan godt ændre resten men ikke lige nu da jeg er på til at blive smidt til weekend fra min skole.

Men i eftermiddag !!
Avatar billede davs Nybegynder
24. september 1999 - 11:46 #9
Har du overvejet at lave den i flash ?

Der er mulighed for at lave noget ret flot, og også gennemtænkt, jeg har på min side plads til 72 Menu punkter, og samtidigt er det meget overskueligt.
Tilmed er det meget nemt for mit at udvide den menu, uden det kommer til at tage ret lang tid.

Den kan self. godt blive meget flottere sådan rent grafisk, men det har jeg ikke haft til til at ændre på endnu. Eftersom jeg bruger tiden på det indholdsmæssige i stedet for.

Flash kan hentes gratis på www.macromedia.com (man kan så teste den i 30 dage, fuld funktionalitet)

Webmaster@anmeldelser.net
Avatar billede pingo Nybegynder
24. september 1999 - 11:50 #10
Flash er desværre hamre ustabilt..

Vi har 4 forskellige NT Workstation maskiner - med IE5 - ALLE laver ulovlige handlinger når der er flash på en side...
Avatar billede skjoldby Nybegynder
24. september 1999 - 12:00 #11
Her er hele koden fra linket(  http://www.bratta.com/dhtml/scripts/menubar2.html  ) ændret med dine konfigurationer:


<html>
<head>
<title>Menu</title>

<style>
body{background-color:#FFFFFF}
A{color:Navy; text-decoration:none}
A:hover{color:red}
A:visited:{color:#808080}
TD{font-family:arial,helvetica; font-size:10pt}
</style>

<style>
A:hover{color:red}
#divBg{position:absolute; width:105%; top:0; left:0; visibility:hidden; height:100}
#divBgColor{position:absolute; top:0; left:0; width:108%; height:30; clip:rect(0,107%,30,0); background-color:Silver; layer-background-color:Silver}
DIV.clSub{position:absolute; top:20; left:0; width:120; visibility:hidden; font-family:arial,helvetica; font-weight:normal; font-size:12px; padding:10px; background-color:Silver; layer-background-color:Silver}
DIV.clTop{position:absolute; font-family:arial,helvetica; font-weight:bold; font-size:13px; visibility:visible; left:100; top:20}
#divTop0{left:5%; top:5}
#divTop1{left:25%; top:5}
#divTop2{left:45%; top:5}
#divTop3{left:65%; top:5}
#divTop4{left:85%; top:5}
</style>

<script language="JavaScript1.2">

/********************************************************************************
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!
********************************************************************************
Browsercheck:*/
ie=document.all?1:0
n=document.layers?1:0

//Do you want it to move with the page if the user scroll the page?
var moveOnScroll=true

//How many menus do you have
numberOfMenus=5


//Do you want to hide all the other submenus when you click a new?
var hideAll=true

/********************************************************************************
If you want to change the appearans on the text, or background or anything
do that in the style tag above, or in the table tag below.

The different event handling on the different browsers makes this a little
tricky. I had to make all divs absolute positioned to make it work in netscape.
So if you ad or remove menuitems please play with the % values of each divTop
in the stylesheet. I have not had all that much luck with % placement before
in netscape so if you encounter any errors et me know and I'll see what I can do.
********************************************************************************/


/********************************************************************************
Object constructor
********************************************************************************/
function makeMenuBar(obj,nest,vis){
    nest=(!nest) ? '':'document.'+nest+'.'
    this.css=(n) ? eval(nest+'document.'+obj):eval(obj+'.style')
        this.hideIt=b_hideIt;  this.showIt=b_showIt                                   
        if(ie && vis) this.css.visibility='hidden'
        this.evnt=(n)? eval(nest+'document.'+obj):eval(obj);   
        this.go=0
        this.height=n?this.css.document.height:eval(obj+'.offsetHeight')
        this.top=b_gettop
    this.obj = obj + "Object";  eval(this.obj + "=this")       
}
//Get's the top position.
function b_gettop(){
        var gleft=(n) ? eval(this.css.top):eval(this.css.pixelTop);
        return gleft;
}
//The functions for showing and hiding
function b_showIt(){
        this.css.visibility="visible"
}
function b_hideIt(){
        this.css.visibility="hidden"
}
/********************************************************************************
Checking if the page is scrolled, if it is move the menu after
********************************************************************************/
function checkScrolled(){
        if(!oMenu.go)oMenu.css.top=(!oMenu.state)?eval(scrolled):eval(scrolled)
        if(n) setTimeout('checkScrolled()',30)
}
/********************************************************************************
Inits the page, makes the menu object, moves it to the right place,
show it..
********************************************************************************/
function menuBarInit(){
        oSub=new Array()
        oTop=new Array()
        for(i=0;i<numberOfMenus;i++){
                oTop[i]=new makeMenuBar('divTop'+i,'divBg')
                oSub[i]=new makeMenuBar('divSub'+i,'divBg.document.divTop'+i,1)
                oSub[i].evnt.onmouseout=evOut;
        }
        //Moving menuBar
        oMenu=new makeMenuBar('divBg')
        scrolled=n?"window.pageYOffset":"document.body.scrollTop"
        oMenu.css.top=eval(scrolled)
        oMenu.css.visibility='visible'
        if(moveOnScroll) ie?window.onscroll=checkScrolled:checkScrolled();

}

/********************************************************************************
Shows and hides the submenus
********************************************************************************/

function evOut(){
        if(ie)this.style.visibility='hidden'
        else if(n) this.visibility='hidden'
}
//Canceling event bubbling in ie
function ieShow(num){
        if(ie){
                oSub[num].showIt()
                window.event.cancelBubble=true
        }
}
function extract(num){
        if(hideAll){
                for(i=0;i<oSub.length;i++){
                        if(num!=i) oSub[i].hideIt()
                }
        }
        oSub[num].showIt();
}
onload=menuBarInit;


</script>
</head>
<body bgcolor="White">
<div id="divBg">
    <div id="divBgColor"></div>
    <div id="divTop0" class="clTop">
            <a href="#" onmouseover="extract(0)">Telefoni</a>
            <div id="divSub0" class="clSub">
                <!-- To make the links link somewhere, just replace the #'s
                with the link location -->
                <a href="fastnet.htm" onmouseover="ieShow(0)" onmouseout="ieShow(0)">Fastnet</a> &nbsp; &nbsp; <br>
        <a href="mobil.htm" onmouseover="ieShow(0)" onmouseout="ieShow(0)">Mobil</a><br>
        <a href="internet.htm" onmouseover="ieShow(0)" onmouseout="ieShow(0)">Internet</a><br>
        <a href="omt.htm" onmouseover="ieShow(0)" onmouseout="ieShow(0)">Internationalt</a> &nbsp; &nbsp; <br><br>
            </div>
    </div>
    <div id="divTop1" class="clTop">
            <a href="#" onmouseover="extract(1)">Reklame</a>
            <div id="divSub1" class="clSub">
                <!-- To make the links link somewhere, just replace the #'s
                with the link location -->
                <a href="info.htm" onmouseover="ieShow(1)" onmouseout="ieShow(1)">Links</a> &nbsp; &nbsp; <br>
        <a href="ad_info.htm" onmouseover="ieShow(1)" onmouseout="ieShow(1)">Reklame info</a> &nbsp; &nbsp; <br><br>
            </div>
    </div>
    <div id="divTop2" class="clTop">
            <a href="#" onmouseover="extract(2)">Kontakt</a>
            <div id="divSub2" class="clSub">
                <!-- To make the links link somewhere, just replace the #'s
                with the link location -->
                <a href="mail.htm" onmouseover="ieShow(2)" onmouseout="ieShow(2)">Kontakt webmaster</a> &nbsp; <br>
        <a href="mail_liste.htm" onmouseover="ieShow(2)" onmouseout="ieShow(2)">Mail-liste</a><br><br>
            </div>
    </div>
    <div id="divTop3" class="clTop">
            <a href="#" onmouseover="extract(3)">Diverse</a>
            <div id="divSub3" class="clSub">
                <!-- To make the links link somewhere, just replace the #'s
                with the link location -->
                <a href="vejled.htm" onmouseover="ieShow(3)" onmouseout="ieShow(3)">Vejledning</a> &nbsp; &nbsp; <br>
                                <a href="mening.htm#" onmouseover="ieShow(3)" onmouseout="ieShow(3)">Vuderinger</a><br>
                                <a href="doner.htm" onmouseover="ieShow(3)" onmouseout="ieShow(3)">St&oslash;t denne side</a><br>
                                <a href="bruger.htm" onmouseover="ieShow(3)" onmouseout="ieShow(3)">Bruger afstemning</a> &nbsp; &nbsp; <br><br>
            </div>   
    </div>
    <div id="divTop4" class="clTop">
            <a href="tak_fast.htm" onmouseover="extract(4)">Tak til</a>
            <div id="divSub4" class="clSub">

            </div>
    </div>
</div>

<br><br><br><br>
<BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR>
</BODY>
</HTML>



Man får helt ondt i armen at skrive så meget.....
..........joke.........


Skjoldby
Avatar billede davs Nybegynder
24. september 1999 - 13:29 #12
Flash 4.0 er kombatibelt med NT.

Ikke flash 3.0 - som mange stadig bruger.

webmaster@anmeldelser.net
Avatar billede mora Nybegynder
27. september 1999 - 07:57 #13
>>>Flash, jeg så dit 1. svar og tilpasseede det selv, men mange tak.

meget let kode at arbejde med :-)
Avatar billede skjoldby Nybegynder
27. september 1999 - 09:19 #14
Er det mig du kalder for flash??? Jeg hedder Skjoldby, Skjoldet, Skjold, Skjoldbasse, SkjoldBurne eller Skjolder...
Kært barn har mange navne..
Tak for points.

Skjoldet
Avatar billede mora Nybegynder
27. september 1999 - 09:56 #15
Hmm.... undskyld, blev forviret af al den falsh snak :-)
Avatar billede mora Nybegynder
27. september 1999 - 14:51 #16
>>>Skjoldby  har lige afprøvet din færdige løsning, den virker  ikke(du behøver ikke lave den om), hvad vil du vælge mellem at have en ramme til min menu eller lade den "følge" teksten i samme ramme?
Avatar billede skjoldby Nybegynder
27. september 1999 - 18:55 #17
Jeg er ikke helt med.. Det med rammen altså...

Underligt at min løsning ikke virker nu.
Prøv at skifte denne funktion ud
function makeMenuBar

- med den der er brugt i linket...

(jeg ved godt det er en hovsaløsning, men med lidt tid kan jeg måske lave noget ordenligt til dig??)

I orden det med navnet :)
Avatar billede mora Nybegynder
27. september 1999 - 20:02 #18
I starten af koden bliver man spurt om menuen skal følge brugeren hvis der scrooles, hvad synes du er best, at bede den følge med, eller have den i en ramme over "main" rammen?
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