CIO Tech Eksperten IT-JOB IT-Kurser Events Podcast Søg

Log ind eller opret profil

Du kan også logge ind via nedenstående tjenester

pfp Nybegynder

19. juli 2001 - 12:17 Der er 21 kommentarer og
1 løsning

Mouseover menu

Hejsa

Er der nogen der kan lave en simpel mouseover menu til mig? Det skal være sådan, at når jeg kører musen henover et billede på fx 3x1cm kommer der nogle andre billeder af samme størrelse frem nedenunder som jeg kan bruge til links. Ligesom menuen på www.tv2.dk og www.netcoders.dk men bare med små billeder i stedet for.

Med venlig hilsen
Peter F. Poulsen

Synes godt om

Jman Praktikant

19. juli 2001 - 12:21 #1

det er ikke billeder, der kommer frem - det er ren html

men du kan se en masse eksempler på hvordan du laver det på http://www.dynamicdrive.com/dynamicindex1/index.html

Synes godt om

NanoQ Nybegynder

19. juli 2001 - 12:23 #2

Prøv engang at se denne: http://home5.swipnet.se/~w-53118/gene.html

Her en lille tutorial: http://www.groan-zone.net/jscript/mouseover.html

og et lille eksempel: http://www.pitchmark.demon.co.uk/jseg02.htm

Ser du sourcen, tror jeg nemt du kan gennemskue den, og lave det du ønsker selv:

<html>
<head>
<title>Javascript - OnMouseOver example</title>
</head>
<body>
<p>Point at the image. He should start to dance on mouse over.</p>
<a href=\"index.htm\"
onMouseOver=\'document.images.dance.src=\"dance.gif\"\'
onMouseOut=\'document.images.dance.src=\"dance_static.gif\"\'>
<img src=\'dance_static.gif\' name=\'dance\' alt=\"dance\" width=32 height=32></a>

<br><br>
<a href=\"jsindex.htm\"> More java script examples </a>
<br>

</body>
</html>

NanoQ

Synes godt om

Jman Praktikant

19. juli 2001 - 12:28 #3

NanoQ - jeg tror han leder efter en dropdown - menu

Synes godt om

pfp Nybegynder

19. juli 2001 - 12:38 #4

jeg leder ikke efter den dropdown menu, med sådan en listeboks-ting. Nærmere noget der ligner menuen på www.smartstone.com oppe i højre hjørne, det behøver slet ikke være så avanceret at det glider ind, men på den måde, håber i forstår hvad jeg tænker på.

Synes godt om

and_ Nybegynder

19. juli 2001 - 12:48 #5

Beklager pfp - Det kaldes nu en dropdown sådan en menu....

Synes godt om

pfp Nybegynder

19. juli 2001 - 12:49 #6

ok, det må i undskylde, jeg troede bare at en dropdown menu, var sådan en comboboks ting.

Synes godt om

Jman Praktikant

19. juli 2001 - 12:53 #7

det er bare en dropdown *S*
Check denne: http://www.dynamicdrive.com/dynamicindex1/topnavbar.htm

demoen er i toppen af siden og der står hvor du skal smide koden ind på din side

Synes godt om

pfp Nybegynder

19. juli 2001 - 12:56 #8

superior-> ja det kan måske bruges, men jeg vil helst have det med billeder i stedet.

Synes godt om

and_ Nybegynder

19. juli 2001 - 12:56 #9

Synes godt om

htorp Nybegynder

19. juli 2001 - 17:50 #10

Skal der være billede for hver link eller må billedet være baggrund for f.eks. 4 links?

Synes godt om

razmuz_dk Nybegynder

19. juli 2001 - 19:27 #11

http://www.rzc.dk/dropdown.php

pfp -> Let at redigere!!

Bare smid et billede ind hvor der står \"Login\" i sourcen fks? - skriv hvis du er i tvivl.

Synes godt om

pfp Nybegynder

19. juli 2001 - 20:17 #12

razmuz.dk -> det var præcis det jeg ledte efter. Mange tak.

/pfp

Synes godt om

razmuz_dk Nybegynder

19. juli 2001 - 20:50 #13

S\'lidt! :o] tark for points

Synes godt om

pfp Nybegynder

19. juli 2001 - 21:13 #14

razmuz.dk -> jeg vil meget gerne have dig til at forklare mig lidt. Prøv at se på www.votus.dk/test.htm

Hvis du kører hvor der står overskrift-2 og overskrift-3 kan du se at menuen nedenunder kommer lidt skævt for, kan jeg ikke rette det?

/pfp

Synes godt om

razmuz_dk Nybegynder

19. juli 2001 - 21:21 #15

Hm, det er fordi du laver lidt for lange menu punkter - men det kan let løses!!

Det med at den \"let\" kan redigeres var vist lidt en løgn! - men hvis du får yderligere problemer så bare post dem her! :o]

<html>

<script Language=\"JavaScript\">

function menu(x,m) {

if (x==\"0\") {

document.all[\"menu\"+m].style.visibility = \"visible\";

}

if (x==\"1\") {

document.all[\"menu\"+m].style.visibility = \"hidden\";

}

}

</script>

<head>

<style>
table,td {
font-size:10;
font-family:verdana;
}

A:link {color:white;text-decoration:none;}

A:visited {color:white;text-decoration:none;}

A:active {color:gray;text-decoration:none;}

A:hover {color:gray;text-decoration:none;}

</style>

</head>

<body>

<table border=\"0\" cellspacing=\"0\" cellpadding=\"0\">
<tr>

<td bgcolor=\"51607C\" width=\"100\" onmouseover=\"menu(0,1)\" onmouseout=\"menu(1,1)\">

<font color=\"FFDE00\"><b><font style=\"cursor: hand\">Overskrift-1</font></b></font>

</td>

<td bgcolor=\"51607C\" width=\"100\" onmouseover=\"menu(0,2)\" onmouseout=\"menu(1,2)\">

<font color=\"FFDE00\"><b><font style=\"cursor: hand\">Overskrift-2</font></b></font>

</td>

<td bgcolor=\"51607C\" width=\"100\" onmouseover=\"menu(0,3)\" onmouseout=\"menu(1,3)\">

<font color=\"FFDE00\"><b><font style=\"cursor: hand\">Overskrift-3</font></b></font>

</td>

</tr>
<tr>
<td colspan=\"3\">

<div id=\"menu1\" onmouseover=\"menu(0,1)\" onmouseout=\"menu(1,1)\" id=\"menu1\" style=\"cursor:hand;position:absolute;visibility:hidden;background-color:19263E;width:100;\">

<table border=\"0\" width=\"100%\" style=\"border: 1 solid #000000\" cellspacing=\"0\" cellpadding=\"3\">
<tr>
<a href=\"Default.asp\"><td width=\"100%\"><font size=\"1\" face=\"Verdana\" color=\"#FFFFFF\">Velkommen</font></td></a>
</tr>
</table>

<table border=\"0\" width=\"100%\" style=\"border: 1 solid #000000\" cellspacing=\"0\" cellpadding=\"3\">
<tr>
<a href=\"Profil.asp\"><td width=\"100%\"><font size=\"1\" face=\"Verdana\" color=\"#FFFFFF\">Profil</font></td></a>
</tr>
</table>

<table border=\"0\" width=\"100%\" style=\"border: 1 solid #000000\" cellspacing=\"0\" cellpadding=\"3\">
<tr>
<a href=\"Maalogvisioner.asp\"><td width=\"100%\"><font size=\"1\" face=\"Verdana\" color=\"#FFFFFF\">Mål og visioner</font></td></a>
</tr>
</table>

</div>                                      

<div id=\"menu2\" onmouseover=\"menu(0,2)\" onmouseout=\"menu(1,2)\" id=\"menu2\" style=\"cursor:hand;position:absolute;visibility:hidden;background-color:19263E;width:100;\">

<table border=\"0\" width=\"100%\" style=\"border: 1 solid #000000\" cellspacing=\"0\" cellpadding=\"3\">
<tr>
<a href=\"Default.asp\"><td width=\"100%\"><font size=\"1\" face=\"Verdana\" color=\"#FFFFFF\">Velkommen</font></td></a>
</tr>
</table>

<table border=\"0\" width=\"100%\" style=\"border: 1 solid #000000\" cellspacing=\"0\" cellpadding=\"3\">
<tr>
<a href=\"Profil.asp\"><td width=\"100%\"><font size=\"1\" face=\"Verdana\" color=\"#FFFFFF\">Profil</font></td></a>
</tr>
</table>

<table border=\"0\" width=\"100%\" style=\"border: 1 solid #000000\" cellspacing=\"0\" cellpadding=\"3\">
<tr>
<a href=\"Maalogvisioner.asp\"><td width=\"100%\"><font size=\"1\" face=\"Verdana\" color=\"#FFFFFF\">Mål og visioner</font></td></a>
</tr>
</table>

</div>                                      

<div id=\"menu3\" onmouseover=\"menu(0,3)\" onmouseout=\"menu(1,3)\" id=\"menu3\" style=\"cursor:hand;position:absolute;visibility:hidden;background-color:19263E;width:100;\">

<table border=\"0\" width=\"100%\" style=\"border: 1 solid #000000\" cellspacing=\"0\" cellpadding=\"3\">
<tr>
<a href=\"Default.asp\"><td width=\"100%\"><font size=\"1\" face=\"Verdana\" color=\"#FFFFFF\">Velkommen</font></td></a>
</tr>
</table>

<table border=\"0\" width=\"100%\" style=\"border: 1 solid #000000\" cellspacing=\"0\" cellpadding=\"3\">
<tr>
<a href=\"Profil.asp\"><td width=\"100%\"><font size=\"1\" face=\"Verdana\" color=\"#FFFFFF\">Profil</font></td></a>
</tr>
</table>

<table border=\"0\" width=\"100%\" style=\"border: 1 solid #000000\" cellspacing=\"0\" cellpadding=\"3\">
<tr>
<a href=\"Maalogvisioner.asp\"><td width=\"100%\"><font size=\"1\" face=\"Verdana\" color=\"#FFFFFF\">Mål og visioner</font></td></a>
</tr>
</table>

</div>                                      

</td>
</tr>
</table>
</body>

</html>

Synes godt om

pfp Nybegynder

19. juli 2001 - 21:27 #16

tak for det. Kan du ikke fortælle mig hvor og hvad det var du rettede, så du ikke behøver at bøvle mere med at rette det til.

Synes godt om

razmuz_dk Nybegynder

19. juli 2001 - 21:47 #17

Der hvor der står en masse af dem her:
 

Dem kan du tilføje og fjerne i ... alt efter hvor lang den skal være - men du skal huske at ændre alle 3 steder! (der er nemmerlig 3 linjer med  )

Synes godt om

pfp Nybegynder

20. juli 2001 - 01:07 #18

razmuz.dk -> hvis du igen prøver at kigge på www.votus.dk/test.htm kan du se at der ligesom er et mellemrum på noget der ligner ca. 3 pixels mellem overskriften og undermenuen, kan jeg ikke fjerne det så det går helt op til?

Synes godt om

razmuz_dk Nybegynder

20. juli 2001 - 02:04 #19

pfp -> jeg er bange for du har rodet lidt rundt i koden! :)))

Her er den igen- med billeder..

<html>

<script Language=\"JavaScript\">

function menu(x,m) {

if (x==\"0\") {

document.all[\"menu\"+m].style.visibility = \"visible\";

}

if (x==\"1\") {

document.all[\"menu\"+m].style.visibility = \"hidden\";

}

}

</script>

<head>

<style>
table,td {
font-size:10;
font-family:verdana;
}

A:link {color:white;text-decoration:none;}

A:visited {color:white;text-decoration:none;}

A:active {color:gray;text-decoration:none;}

A:hover {color:gray;text-decoration:none;}

</style>

</head>

<body>

<table border=\"0\" cellspacing=\"0\" cellpadding=\"0\">
<tr>

<td bgcolor=\"51607C\" width=\"100\" onmouseover=\"menu(0,1)\" onmouseout=\"menu(1,1)\">

<font color=\"FFDE00\"><b><font style=\"cursor: hand\">
<img src=\"BILLEDE 1\">
</font></b></font>

</td>

<td bgcolor=\"51607C\" width=\"100\" onmouseover=\"menu(0,2)\" onmouseout=\"menu(1,2)\">

<font color=\"FFDE00\"><b><font style=\"cursor: hand\">
<img src=\"BILLEDE 2\">
</font></b></font>

</td>

<td bgcolor=\"51607C\" width=\"100\" onmouseover=\"menu(0,3)\" onmouseout=\"menu(1,3)\">

<font color=\"FFDE00\"><b><font style=\"cursor: hand\">
<img src=\"BILLEDE 3\">
</font></b></font>

</td>

</tr>
<tr>
<td colspan=\"3\">

<div id=\"menu1\" onmouseover=\"menu(0,1)\" onmouseout=\"menu(1,1)\" id=\"menu1\" style=\"cursor:hand;position:absolute;visibility:hidden;background-color:19263E;width:100;\">

<table border=\"0\" width=\"100%\" style=\"border: 1 solid #000000\" cellspacing=\"0\" cellpadding=\"3\">
<tr>
<a href=\"Default.asp\"><td width=\"100%\"><font size=\"1\" face=\"Verdana\" color=\"#FFFFFF\">Velkommen</font></td></a>
</tr>
</table>

<table border=\"0\" width=\"100%\" style=\"border: 1 solid #000000\" cellspacing=\"0\" cellpadding=\"3\">
<tr>
<a href=\"Profil.asp\"><td width=\"100%\"><font size=\"1\" face=\"Verdana\" color=\"#FFFFFF\">Profil</font></td></a>
</tr>
</table>

<table border=\"0\" width=\"100%\" style=\"border: 1 solid #000000\" cellspacing=\"0\" cellpadding=\"3\">
<tr>
<a href=\"Maalogvisioner.asp\"><td width=\"100%\"><font size=\"1\" face=\"Verdana\" color=\"#FFFFFF\">Mål og visioner</font></td></a>
</tr>
</table>

</div>                                      

<div id=\"menu2\" onmouseover=\"menu(0,2)\" onmouseout=\"menu(1,2)\" id=\"menu2\" style=\"cursor:hand;position:absolute;visibility:hidden;background-color:19263E;width:100;\">

<table border=\"0\" width=\"100%\" style=\"border: 1 solid #000000\" cellspacing=\"0\" cellpadding=\"3\">
<tr>
<a href=\"Default.asp\"><td width=\"100%\"><font size=\"1\" face=\"Verdana\" color=\"#FFFFFF\">Velkommen</font></td></a>
</tr>
</table>

<table border=\"0\" width=\"100%\" style=\"border: 1 solid #000000\" cellspacing=\"0\" cellpadding=\"3\">
<tr>
<a href=\"Profil.asp\"><td width=\"100%\"><font size=\"1\" face=\"Verdana\" color=\"#FFFFFF\">Profil</font></td></a>
</tr>
</table>

<table border=\"0\" width=\"100%\" style=\"border: 1 solid #000000\" cellspacing=\"0\" cellpadding=\"3\">
<tr>
<a href=\"Maalogvisioner.asp\"><td width=\"100%\"><font size=\"1\" face=\"Verdana\" color=\"#FFFFFF\">Mål og visioner</font></td></a>
</tr>
</table>

</div>                                      

<div id=\"menu3\" onmouseover=\"menu(0,3)\" onmouseout=\"menu(1,3)\" id=\"menu3\" style=\"cursor:hand;position:absolute;visibility:hidden;background-color:19263E;width:100;\">

<table border=\"0\" width=\"100%\" style=\"border: 1 solid #000000\" cellspacing=\"0\" cellpadding=\"3\">
<tr>
<a href=\"Default.asp\"><td width=\"100%\"><font size=\"1\" face=\"Verdana\" color=\"#FFFFFF\">Velkommen</font></td></a>
</tr>
</table>

<table border=\"0\" width=\"100%\" style=\"border: 1 solid #000000\" cellspacing=\"0\" cellpadding=\"3\">
<tr>
<a href=\"Profil.asp\"><td width=\"100%\"><font size=\"1\" face=\"Verdana\" color=\"#FFFFFF\">Profil</font></td></a>
</tr>
</table>

<table border=\"0\" width=\"100%\" style=\"border: 1 solid #000000\" cellspacing=\"0\" cellpadding=\"3\">
<tr>
<a href=\"Maalogvisioner.asp\"><td width=\"100%\"><font size=\"1\" face=\"Verdana\" color=\"#FFFFFF\">Mål og visioner</font></td></a>
</tr>
</table>

</div>                                      

</td>
</tr>
</table>
</body>

</html>

Synes godt om

htorp Nybegynder

20. juli 2001 - 10:34 #20

pfp -> Er du opmærksom på at menuen ikke virker i alle browsere?

Det skyldes at document.all anvendes til at kalde css-lag. Document.all er IE4-5, nok ikke IE6.

NN4 bruger document.layers
NN6 og DOM bruger document.getelementbyID(\"lag\"). IE5 og frem kender også denne kaldemetode.

Synes godt om

pfp Nybegynder

20. juli 2001 - 13:49 #21

hvad betyder det når der står <td colspan=\"3\">?

Synes godt om

razmuz_dk Nybegynder

20. juli 2001 - 13:58 #22

Det betyder at den \"strækker\" sig over 3 td\'er i en \"ny etage\" (<tr>)

Forstår du?

fks

<table>
<tr>
<td colspan=3></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</table>

eller ..

<table>
<tr>
<td colspan=2>Denne strækker sig over td 1 og 2</td>
<td colspan=3>Denne strækker sig over td 3,4 og 5.</td>
</tr>
<tr>
<td>TD 1</td>
<td>TD 2</td>
<td>TD 3</td>
<td>TD 4</td>
<td>TD 5</td>
</tr>
</table>

Prøv at køre det i et html dok. så forstår du! :o]

Synes godt om

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.

Følg dette spørgsmål

Opret Preview

Webudvikling kurser

Vi tilbyder markedets bedste kurser inden for webudvikling

Se alle Webudvikling kurser

Flere spørgsmål fra HTML kategorien

Titel	Indlæg	Oprettet	Seneste aktivitet
Bredde på div elementer Af dane022 i HTML	2	16/02/202408:29	20/02/202412:50
Hvilken mindste mobilstørrelse til hjemmeside Af CSharpRazor i HTML	2	21/12/202322:51	22/12/202308:03
validering <input tlfnr. Af slein55 i HTML	5	15/10/202311:43	15/10/202314:51
Link fra form input Af jnrmgs i HTML	9	19/09/202319:10	23/09/202313:11
includere i HTML Af slein55 i HTML	3	15/09/202313:47	16/09/202309:40

Se alle spørgsmål i kategorien Opret spørgsmål

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

Alle kategorier på Eksperten

Seneste artiklerRSS

21:15

Til åbningsfest i det nye NNIT-hovedkontor: ”Som at flytte til New York sammenlignet med der hvor vi kommer fra” - se alle billederne

16/08

Test: Den ideelle form for videoovervågning, hvis du bor i lejlighed

16/08

Stjålet kunde-data fra VVS-Eksperten flyder frit på dark web: Advarer sine kunder mod identitetstyveri efter angreb

16/08

Nørgaard: Kommer vi nogensinde til at kunne stole på software igen? Jim mener ja. Jeg tvivler

16/08

Microsoft: Denne type cyberangreb er steget med mere end 100 procent på et år

16/08

Gigantisk firewall skal indramme 240 millioner mennesker: Softwareleverandører frygter kæmpe forstyrrelser

16/08

Her er 10 smarte Power Toys-værktøjer, du bør anvende i Windows

16/08

Tag det næste skridt i karrieren: Vi har fundet 10 spændende it-stillinger, som du kan søge lige nu

16/08

Google lancerer sin AI-søgemaskine i flere lande - går uden om Danmark

16/08

Digitaliseringsstyrelsen vil have privat leverandør til at overvåge danske hjemmesider: Står klar med ubegrænset kontrakt

16/08

Nu kommer filmen om showet, der skabte de store stjerner

Vis flere artikler

IT-JOB

ATP

It-tester til projektteam med fokus på kvalitetssikring af integrationer og test af digitale løsninger

Udviklings- og Forenklingsstyrelsen

Backend-udvikler til Java-baserede microservices

Gyldendal A/S

Softwaremanager som brænder for test og testprocesser i et højteknologisk miljø

Banedanmark

Data Engineer

AK Techotel A/S

Systemudvikler søges til innovativt firma, med godt arbejdsmiljø og mulighed for

Vis flere jobs

Seneste spørgsmål Seneste aktivitet

Lige nu	Kan ikke komme på nettet med opera for xp Af edbjohn i Browsere
I dag 09:19	W11 fra 22H2 til 23H2 Af barth i Windows
I går 18:36	batteri Af grzona i Mobiltelefoner
I går 16:50	Samsung Odyssey Neo G8 Qled 240 Hz Display Port Problem Af Shamanji i Skærme
I går 10:28	PDFEngine Af barth i Andet software