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

m-koldsgaard Nybegynder

09. august 2001 - 20:24 Der er 13 kommentarer og
2 løsninger

OnMouseOver layer i midten af billed

Hej alle sammen

Jeg har et billed som skal bruges som menu på forside. Jeg har lavet nogle \"hotspot\'er\" som jeg kan klikke på. Men nu er det så meningen at der ved hjælp af Onmouseover skal kommer et layer i midten af billedet og forklare lidt om siden man kommer hen på.

hvordan gør man lettets det???

Synes godt om

kaare.petersen Nybegynder

09. august 2001 - 20:35 #1

Du opretter et antal <DIV> elementer , 1 for hvert lag. herefter lægger du forklaringen ind i hvert div lag. disse lag skal alle have et navn fx
<DIV name=\"divlag1\">beskrivelse 1</DIV>

nu laver du et stylesheet i headen
<STYLE>
#Divlag1 {position:absolute; top:150; left:150; visibility:hidden;}
</STYLE>

nu kan du så på eventhandleren onmouseover skrive følgende:
onmouseover=\"java script:document.divlag1.visibility=visible\" og på onmouseout=\"document.divlag1.visibility=hidden\"

Synes godt om

m-koldsgaard Nybegynder

09. august 2001 - 20:39 #2

Kommer layerne så 150px inde på billedet???

Synes godt om

m-koldsgaard Nybegynder

09. august 2001 - 20:40 #3

Kommer de ikke bare 150px fra oven og 150px fra venstre af siden?

Synes godt om

roenving Novice

09. august 2001 - 20:46 #4

Det kommer an på, om du definerer dem inden for layer\'en, så du skal selvfølgelig definere dem inden i.

-- jeg er lidt usikker på om det så vil være smart at lægge en frame udenom -- det har jeg ikke prøvet selv.

hth
jes

Synes godt om

m-koldsgaard Nybegynder

09. august 2001 - 20:48 #5

Hvordan definerer man dem inden for layer\'en???

Synes godt om

roenving Novice

09. august 2001 - 20:57 #6

En <DIV> mener jeg du kan behandle som et *helt* vindue (altså et html-dokument -- ligesom du kan med en frame), så en reference, som er inden inden i layeren, burde referere til det vindue, som aktuelt er det \'aktiveste\'. Hvis min usikkerhed om framen er rigtig kan det være, at du skal definere en frame inde i div\'en !~]

For øvrigt tror jeg du skal sætte et z-index (bestemmer hvad der er øverst), sådan du er sikker på, at nyere oprettede lag ikke kommer ovenpå, dvs.

<STYLE>
#Divlag1 {position:absolute; top:150; left:150; visibility:hidden;z-index=100}
</STYLE>

hth
jes

Synes godt om

m-koldsgaard Nybegynder

09. august 2001 - 21:04 #7

Kan jeg få noget kode?

Synes godt om

kaare.petersen Nybegynder

09. august 2001 - 21:49 #8

<html>
<head>
<title>Untitled</title>
<STYLE>
#div1 { visibility : hidden; top : 150; position : absolute; left : 100; background-color : Red;}
#div2 { visibility : hidden; top : 150; position : absolute; left : 100; background-color : Blue;}
</STYLE>
</head>
<body>
<a href=\"#\" onmouseover=\"java script:div1.style.visibility=\'visible\'\" onmouseout=\"java script:div1.style.visibility=\'hidden\'\">Vis lag 1</a><br>
<a href=\"#\" onmouseover=\"java script:div2.style.visibility=\'visible\'\" onmouseout=\"java script:div2.style.visibility=\'hidden\'\">Vis lag 2</a><br>
<DIV ID=\"div1\">Dette er lag et</DIV>
<DIV ID=\"div2\">Dette er lag to</DIV>
</body>
</html>

Synes godt om

kaare.petersen Nybegynder

09. august 2001 - 21:50 #9

Her skulle være et simpelt eksempel med to lag.. og du behøver ikke z-order, da du jo slukker laget når musen fjernes fra linket.

Synes godt om

m-koldsgaard Nybegynder

09. august 2001 - 21:56 #10

Ja men den position er jo 150px fra top af dok. og 100px ind fra venstre.

Det SKAL jo være f.eks. 50px fra toppen af billedet og måske 50px ind fra venstre.

Synes godt om

m-koldsgaard Nybegynder

09. august 2001 - 22:01 #11

Så jeg mangler kun koden som gør at layer sider f.eks. 50px fra topprn og f.eks. 50px fra venstre af BILLEDET!!!

Synes godt om

kaare.petersen Nybegynder

10. august 2001 - 08:37 #12

du giver simpelhen billede en absolut position også *S*

<html>
<head>
<title>Untitled</title>
<STYLE>
#div1 { visibility : hidden; top : 150; position : absolute; left : 100; background-color : Red;}
#div2 { visibility : hidden; top : 150; position : absolute; left : 100; background-color : Blue;}
#billede { top : 100; position : absolute; left : 50; }
</STYLE>
</head>
<body>
<a href=\"#\" onmouseover=\"java script:div1.style.visibility=\'visible\'\" onmouseout=\"java script:div1.style.visibility=\'hidden\'\">Vis lag 1</a><br>
<a href=\"#\" onmouseover=\"java script:div2.style.visibility=\'visible\'\" onmouseout=\"java script:div2.style.visibility=\'hidden\'\">Vis lag 2</a><br>
<IMG ID=\"billede\" src=\"test1.jpg\" heigth=\"200\" width=\"200\">
<DIV ID=\"div1\">Dette er lag et</DIV>
<DIV ID=\"div2\">Dette er lag to</DIV>
</body>
</html>

Synes godt om

kaare.petersen Nybegynder

10. august 2001 - 09:24 #13

du skal så bare sætte onmouseover på IMG tagget istedet for.

Giv evt. en z-order på 1 til billede og 2 til alle DIV lagene

Synes godt om

m-koldsgaard Nybegynder

12. august 2001 - 11:05 #14

hvordan vil du så få det \"store\" billede i midten?

Synes godt om

m-koldsgaard Nybegynder

12. august 2001 - 16:59 #15

Nå, ingen svar

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
Variabler som ikke virker Af Frits Jensen i HTML	3	30/10/202409:37	01/01/202515:27
Aldersbegrænsning på min hjemmeside Af ØLMANDEN i HTML	2	29/09/202410:58	30/09/202412:04
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

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