Notifikationer

Markér alle som læst Log ud

steen_hansen Forsker

06. december 2003 - 23:52 Der er 50 kommentarer og
1 løsning

CSS driller ad H til. Hjælp ønskes! :o(

Jeg har bakset med at få en menu til at virke. Her er mit CSS:

A.menu
{
FONT:11px Verdana, Arial, Helvetica;
BACKGROUND-IMAGE: url(images/menu_bg_transp.gif);
TEXT-DECORATION: none;
COLOR: #868686;
WIDTH: 100%;
PADDING: 4px;
}
A.menu:hover
{
FONT:11px Verdana, Arial, Helvetica;
BACKGROUND-IMAGE: url(images/menu_bg_red.gif);
TEXT-DECORATION: none;
COLOR: #000000;
WIDTH: 100%;
PADDING: 4px;
}
A.menu:active
{
FONT:11px Verdana, Arial, Helvetica;
BACKGROUND-IMAGE: url(images/menu_bg_red.gif);
TEXT-DECORATION: none;
COLOR: #000000;
WIDTH: 100%;
PADDING: 4px;
}
A
{
FONT-SIZE: 11px;
COLOR: #868686;
FONT-FAMILY: Verdana, Arial, Helvetica;
TEXT-DECORATION: none
}
A:hover
{
COLOR: #000000;
TEXT-DECORATION: none
}

Menuen ser således ud:

<table class="menu">
<tr>
<td><a href="/minmappe/">Link 1</a></td>
</tr>
<tr>
<td><a href="#">Link 2</a></td>
</tr>
</table>

Link 2 virker perfekt, men når jeg putter et virkeligt link ind, virker det som om, at A.menu bliver overrulet af A

Jeg har også forsøgt mig med ren grafik, men det hjælper ikke. Håber MEGET på en hjælp til løsning af problemet :o/

Synes godt om

perj Nybegynder

06. december 2003 - 23:59 #1

Prøv lige med:
<a href="http://www.xxx.dk/default.asp">
Ved ikke om det virker.

Synes godt om

steen_hansen Forsker

07. december 2003 - 00:01 #2

Tro mig, alle muligheder er afprøvet, også med ..../default.asp :o)

Synes godt om

perj Nybegynder

07. december 2003 - 00:02 #3

Jeg mener et relativt link

Synes godt om

steen_hansen Forsker

07. december 2003 - 00:03 #4

Så er det jo

A
{
FONT-SIZE: 11px;
COLOR: #868686;
FONT-FAMILY: Verdana, Arial, Helvetica;
TEXT-DECORATION: none
}
A:hover
{
COLOR: #000000;
TEXT-DECORATION: none
}

der træder i kraft. Jeg er ikke helt med på hvad du mener?

Synes godt om

schaefner Juniormester

07. december 2003 - 00:05 #5

Synes godt om

schaefner Juniormester

07. december 2003 - 00:06 #6

eller:

.menu a:hover {
}

Synes godt om

steen_hansen Forsker

07. december 2003 - 00:08 #7

Ok -

<table class="menu">

- og

<a href="/minmappe1/" class="menu">Link 1</a>
<a href="/minmappe2/" class="menu">Link 2</a>
<a href="/minmappe2/defaul.asp" class="menu">Link 2</a>
<a href="http://www.xxx.dk/minmappe2/defaul.asp" class="menu">Link 2</a>

- er afprøvet.

Synes godt om

steen_hansen Forsker

07. december 2003 - 00:09 #8

... og det virker ikke

Synes godt om

schaefner Juniormester

07. december 2003 - 00:09 #9

hvad er det præcis du ønsker?

Forskellige links?

Synes godt om

schaefner Juniormester

07. december 2003 - 00:09 #10

http://schaefner.dk/~exp/315701.html ?

Synes godt om

steen_hansen Forsker

07. december 2003 - 00:15 #11

Nej, jeg ønsker hover-effekten + at det valgte link skal have en anden farve, så brugeren hele tiden er bevidst om hvor han/hun befinder sig. Jeg har lavet noget CSS, som virker:

A.menu
{
WIDTH: 100%; DISPLAY: block;
PADDING: 5px 0px 5px 5px;
FONT:bold 11px Verdana, Arial, Helvetica;
TEXT-DECORATION: none;
COLOR: white;
}
A.menu:active, A.menu:link, A.menu:visited
{
BACKGROUND-COLOR: #393939;
COLOR: E7E7E7;
TEXT-DECORATION: none;
}
A.menu:hover
{
BACKGROUND-COLOR: #000000;
}

Men her er det kun tekst og skift af baggrundsfarve. Men det valgte link i dette CSS får ikke en bestemt ønsket farve, baggrunden skifter bare tilbage.

Synes godt om

perj Nybegynder

07. december 2003 - 00:17 #12

Er det nogenlunde som dette her du mener? http://www.fjendsnet.dk/

Synes godt om

schaefner Juniormester

07. december 2003 - 00:17 #13

altså når du skrifter side, så vil det jo være et ganske almindeligt link.

Synes godt om

schaefner Juniormester

07. december 2003 - 00:18 #14

skrifter = skifter

Synes godt om

roenving Novice

07. december 2003 - 00:18 #15

:active betyder at muse-knappen trykkes ned på linket !-)

Andre muligheder findes ikke med css !o]

Synes godt om

steen_hansen Forsker

07. december 2003 - 00:19 #16

Det er NÆSTEN sådan noget jeg er ude efter. Det er faktisk det, som det sidste CSS udfører, det er der ingen problemer i. Men jeg vil gerne have, at den orange farve forbliver orange, når man har valgt et link (http://www.fjendsnet.dk/). Jeg vil også gerne kunne benytte grafik, ikke kun tekst.

Synes godt om

schaefner Juniormester

07. december 2003 - 00:20 #17

medmindre du bruger frames.

Synes godt om

steen_hansen Forsker

07. december 2003 - 00:31 #18

Nej, jeg bruger ikke frames, og jeg har kun ét CSS-dokument.

Jeg laver en tabel og sætter nogle test-links ind:

<a href="#" class="menu">Test 1</a>
<a href="#" class="menu">Test 2</a>
<a href="#" class="menu">Test 3</a>

Det virker perfekt, både med alm. tekst og grafik. Lige så snart jeg sætter stiangivelser på, virker det som om, at A.menu bliver overrulet af A

<a href="/minmappe/admin.asp" class="menu">Admin</a>
<a href="/minmappe/default.asp" class="menu">Hjem</a>
<a href="/minmappe/" class="menu">Hjem</a>

Så står class="menu" af, og det virker kun som alm. links.

Synes godt om

steen_hansen Forsker

07. december 2003 - 00:38 #19

Sorry, roenvig, så ikke dit indlæg. Det virker ellers fint, hvis jeg bare benytter

<a href="#" class="menu">Test 1</a>

Prøv at se på www.bt.dk (den hvide menu)

Synes godt om

steen_hansen Forsker

07. december 2003 - 00:46 #20

Ingen forslag? :o/

Synes godt om

perj Nybegynder

07. december 2003 - 00:49 #21

Venter spændt på om du finder en løsning. Har for et par år siden uden held forsøgt at lave det samme på fjendsnet:-)

Synes godt om

steen_hansen Forsker

07. december 2003 - 00:50 #22

Ok, jeg håber det godt nok. Jeg har brugt TIMER på det ..... skidt!

Synes godt om

roenving Novice

07. december 2003 - 00:58 #23

I øvrigt betyder a.menu et <a>-tag med class menu, hvis du vil have et <a>-tag som er efterkommer af menu hedder det: .menu a

Synes godt om

steen_hansen Forsker

07. december 2003 - 01:02 #24

Kan du uddybe den en smule?

Synes godt om

steen_hansen Forsker

07. december 2003 - 01:26 #25

Ok, jeg smutter i seng. Håber der er nogle, der kan hjælpe med noget brugbart i morgen.

Synes godt om

roenving Novice

07. december 2003 - 01:56 #26

Lidt eksempel på noget af det som virker ...

-- kan heller ik' li'e forstå at andre ting ik' virker:

<html>
<head>
<title>Forskellige links</title>
<style type="text/css">
a,a:link:visited{
font-size: 11px;
color: #868686;
font-family: verdana, arial, helvetica;
text-decoration: none;
}
a:hover{
color: #000000;
}
.menu a:link:visited{
font:11px verdana, arial, helvetica;
background-image: url('images/menu_bg_transp.gif');
text-decoration: none;
color: #868686;
width: 100%;
padding: 4px;
}
.menu a:hover{
background-color:red;
color: #000000;
}
.menu a:active{
background-image: url(images/menu_bg_red.gif);
color: #000000;
}
.extraLink:hover{
background:pink;
}
</style>
</head>
<body>
<a href="/minmappe/">Link 0</a>
<table>
<tr>
<td><a href="/minmappe/">Link 1</a></td>
</tr>
<tr class="menu">
<td><a href="#">Link 2</a></td>
</tr>
<tr>
<td><a class="extraLink" href="#">Link extra</a></td>
</tr>
</table>
</body>
</html>

Synes godt om

steen_hansen Forsker

08. december 2003 - 06:32 #27

Det virker heller ikke, roenvig :o(

Synes godt om

roenving Novice

08. december 2003 - 07:16 #28

-- får du ikke en pink baggrund på det ekstra link ?-)

Synes godt om

steen_hansen Forsker

08. december 2003 - 07:21 #29

Jo, jeg får de tilsigtede effekter, men så snart jeg lægger et reelt link ind, har jeg det samme problem :o/

Synes godt om

roenving Novice

08. december 2003 - 07:33 #30

Ændrer det at du laver det om til et link ?-)

Synes godt om

steen_hansen Forsker

08. december 2003 - 07:37 #31

Yep, det er netop dét, at der er problemet.

Så længe, at linket ser således ud, virker det fint:

<a href="#">Link</a>

Sætter jeg et reelt link ind, bliver A.menu overrulet (sådan virker det):

<a href="/minmappe/">Link</a>

Se også indlæg fra 07/12-2003 00:31:30

Synes godt om

roenving Novice

08. december 2003 - 07:45 #32

-- også, hvis du skriver som i 07/12-2003 01:56:47 ?-)

Synes godt om

steen_hansen Forsker

08. december 2003 - 07:49 #33

Ja, jeg har også lige forsøgt med en target="_blank" for at se, om det virker. Har du prøvet at lægge dit forslag ud? I givet fald, virker det hos dig?

Synes godt om

steen_hansen Forsker

08. december 2003 - 07:50 #34

"Har du prøvet at lægge dit forslag ud?" = Har du prøvet at uploade dit forslag og prøvet det af i praksis?

Synes godt om

roenving Novice

08. december 2003 - 07:52 #35

Jeg har løbende testet i min webwriter og lejlighedsvis haft den igennem IE, et par gange har jeg krydstestet i mozilla ...

Synes godt om

roenving Novice

08. december 2003 - 07:53 #36

a.menu er noget vrøvl, derfor spørger jeg ...

Synes godt om

steen_hansen Forsker

08. december 2003 - 07:58 #37

Ok, og det virker hos dig?

Hvorfor er A.menu noget vrøvl? Jeg ved godt du skrev det i 07/12-2003 00:58:53, men jeg har ellers haft en tyrkertro på, at det var korrekt.

Synes godt om

steen_hansen Forsker

08. december 2003 - 09:26 #38

Hm, det virker slet ikke, hvis jeg skriver .menu a:hover ...?

Synes godt om

steen_hansen Forsker

08. december 2003 - 09:48 #39

Ok, jeg kan ikke få det til at virke ordentligt. Er her nogen, som har en færdig menu, som den hvis på www.bt.dk? Man skal gerne kunne anvende grafik også.

Synes godt om

steen_hansen Forsker

08. december 2003 - 12:55 #40

HJÆLP :o(

Synes godt om

roenving Novice

08. december 2003 - 16:33 #41

>>07:58:38
Du kan se forklaringen her:
http://www.w3.org/TR/REC-CSS2/selector.html

-- og en ganske glimrende menu, som også kan det kan du finde f.eks. hos Thomas Brattli:
http://www.dhtmlcentral.com/projects/coolmenus/

Eller kig på
http://www.burmees.nl/menu/menus.htm
med lidt hjælp her:
http://www.webdesign101.dk/xhtml/navigation/hvmenu/index.php

Synes godt om

claus_jac Nybegynder

11. december 2003 - 17:28 #42

Undskyld jeg lige blander mig lidt, men roenving har lidt ret her. Det har noget at gøre med den måde du sætter selector på dine links. Nedarvning er ikke synderligt godt understøttet, men istedet for en class lav en ID Dvs.
<table id="menu"> derefter i css prøv at lave en #menu a:hover {}
og husk at sætte dine generelle attributter først, der er nemlig overruling involveret i css. Et andet problem er nok, at du styler en tabel og ikke links!!! det går som regel aldrig godt. på min måde siger du alle nedarvninger fra tabellen af typen a:hover skal style på bla. (det er noget strukturelt omstændeligt, men det plejer at virke.)

Håber det hjælper.

Claus

Synes godt om

steen_hansen Forsker

11. december 2003 - 21:21 #43

Hej Claus!

Jeg forsøger ikke at style tabellen, jeg siger blot, at jeg har forsøgt (næsten) alt. Også en <table class="menu">

Prøver lige dine forslag.

Synes godt om

steen_hansen Forsker

11. december 2003 - 22:57 #44

Det er nøjagtigt det samme. Jeg giver snart op. Håber I har lyst til lægge noget kode, som I VED vil virke. Jeg kan IKKE få det skidt til at makke ret :o(

Synes godt om

steen_hansen Forsker

20. december 2003 - 08:22 #45

Der er ingen, der har noget færdigt kode, som bare virker?

Synes godt om

claus_jac Nybegynder

20. december 2003 - 18:15 #46

Hmm Steen. Jeg tror faktisk du søger noget der ligner det denne artikel beskriver! http://www.hicksdesign.co.uk/articles/archives/000271.php

Synes godt om

steen_hansen Forsker

30. december 2003 - 22:42 #47

Ups, sorry, kom helt bort fra dette spørgsmål.

Jeg vil afprøve linket hurtigst muligt og vende tilbage, claus_jac.

Synes godt om

steen_hansen Forsker

13. januar 2004 - 22:01 #48

Jeg kom bort fra det igen, sorry :o(

Nu ser min test.asp således ud:

<html>

<head>
<title></title>
<link rel="stylesheet" type="text/css" href="test.css">
</head>

<body id="home">

<ul id="navlist">
<li><a href="test.asp" id="homenav">Home</a></li>
<li><a href="test.asp" id="prodnav">Products</a></li>
<li><a href="test.asp" id="faqnav">FAQ</a></li>
<li><a href="test.asp" id="connav">contact us</a></li>
</ul>

</body>

</html>

Mit CSS-dokument:

body#home a#homenav,
body#products a#prodnav,
body#faq a#faqnav,
body#contact a#connav {
color: #fff;
background: #930;
}

Men nu er det kun "Home", der er markeret?

Synes godt om

steen_hansen Forsker

13. januar 2004 - 22:19 #49

Undskyld, jeg har jo kun linket til test.asp. Jeg har nu lavet 4 dokumenter:

<html>

<head>
<title></title>
<link rel="stylesheet" type="text/css" href="test.css">
</head>

<body id="home">

<ul id="navlist">
<li><a href="test.asp" id="homenav">Home</a></li>
<li><a href="test1.asp" id="prodnav">Products</a></li>
<li><a href="test2.asp" id="faqnav">FAQ</a></li>
<li><a href="test3.asp" id="connav">contact us</a></li>
</ul>

</body>

</html>

Men det er stadig kun "Home", der er markeret?

Synes godt om

steen_hansen Forsker

14. januar 2004 - 00:38 #50

JO SQ! :o)

Jeg skulle selvfølgelig lige rette <body id="...."> til på hvert dokument. Takker mange gange :o)

Synes godt om

steen_hansen Forsker

14. januar 2004 - 00:51 #51

Ups, den mangler jo denne onMouseover! Nu tuder jeg snart :o(

Jeg håber det kan laves?

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
Hjælp med HTML og CSS Af Nojsa i HTML	18	10/09/202515:07	17/09/202515:11
CSS 2 x firkanter + tekst på samme linje Af nemlig i HTML	3	19/03/202522:16	20/03/202513:04
Se og ændre html på en webside Af magger i HTML	4	11/03/202513:55	12/03/202506:56
Få input felt, der er med fed skrift og formatteres på linje Af KurtG i HTML	5	02/03/202520:05	04/03/202515:40
Variabler som ikke virker Af Frits Jensen i HTML	3	30/10/202409:37	01/01/202515:27

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