/ Forside / Teknologi / Udvikling / HTML / Nyhedsindlæg
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
HTML
#NavnPoint
molokyle 11184
Klaudi 5506
bentjuul 3377
severino 2040
smorch 1950
strarup 1525
natmaden 1396
scootergr.. 1320
e.c 1150
10  miritdk 1110
Links - forskellige farver
Fra : Hans Jørgen Lassen


Dato : 14-03-05 12:55

Kan man godt på samme side give links forskellig farve, når markøren hoverer
over dem?

Jeg har en menu, hvor baggrunden bliver mørk og linksteksten lys, når
markøren svæver over dem.
I hovedteksten er baggrunden fast meget lysere, og jeg ville derfor gerne
kunne lave linksteksten mørk, når markøren er i nærheden.

Det er muligvis meget simpelt, men så tilgiv mig min uvidenhed.

Prøvesiden findes her: http://www.anholtskole.dk/nytsite/index.php

Hilsen, HansJ

PS. Jeg ved godt, at menuen ikke virker i FireFox, og linksene er heller
ikke rettet til endnu.



 
 
Jens Gyldenkærne Cla~ (14-03-2005)
Kommentar
Fra : Jens Gyldenkærne Cla~


Dato : 14-03-05 13:29

Hans Jørgen Lassen skrev:

> Kan man godt på samme side give links forskellig farve, når markøren hoverer
> over dem?

Sagtens.

Kombiner eksemplerne på <http://html.dk/tutorials/css/lektion6.asp> og
<http://html.dk/tutorials/css/lektion7.asp> - så har du løsningen.

NB: Pseudoklassen (:hover) skal stå efter klassenavnet.

En mere elegant måde at opnå det samme på er via kontekstuelle
selektorer. Det går ud på at man med en css-selektor kan ramme elementer
ud fra hvor (i hvilke elementer) de er placeret på siden.

Skriver man fx

..menu a{ color: green; }

- vil man fange de tre links i menuen herunder, uden at påvirke det
fjerde og sidste link:

<div class="menu">
   <a href="1"...>1</a>
   <a href="2"...>2</a>
   <a href="3"...>3</a>
<div>
<p>Her er et <a href="link">link</a> uden for menuen</p>

".menu a" skal læses som "et a-element (link) placeret inde i noget med
klassen menu"

Andre eksempler kan være:

ul li{ color: red; } (farver alle listepunkter i en unummereret liste,
men ikke listeelementer i nummererede lister)

#menu a{ text-decoration: none; } (fjerner understregning på links
placeret i et element med id-værdien menu (fx <div id="menu">).

fieldset p{ text-align: right; } (brug højrejustering på tekstafsnit
i fieldset)


> PS. Jeg ved godt, at menuen ikke virker i FireFox,

Det kan du evt. få hjælp til i clientside-gruppen. Problemet er at du
tilgår nogle html-elementer direkte. Brug document.getElementById i
stedet - så virker det i alle nyere browsere. Hvis gamle IE-udgaver skal
med, kan du kombinere med document.all.

NB: Du har også et par valideringsfejl på siden.

--
Jens Gyldenkærne Clausen
Svar venligst under det du citerer, og citer kun det der er
nødvendigt for at forstå dit svar i sammenhængen. Se hvorfor og
hvordan på http://usenet.dk/netikette/citatteknik.html

Hans Jørgen Lassen (14-03-2005)
Kommentar
Fra : Hans Jørgen Lassen


Dato : 14-03-05 16:10

"Jens Gyldenkærne Clausen" skrev ...

.... en masse gode forslag.

Nu har jeg så sandelig noget at arbejde videre med.

Tusind tak!

Hilsen,
Hans Jørgen



Hans Jørgen Lassen (14-03-2005)
Kommentar
Fra : Hans Jørgen Lassen


Dato : 14-03-05 16:40

"Jens Gyldenkærne Clausen" skrev:

> En mere elegant måde at opnå det samme på er via kontekstuelle
> selektorer. Det går ud på at man med en css-selektor kan ramme elementer
> ud fra hvor (i hvilke elementer) de er placeret på siden.
>
> Andre eksempler kan være:
>
> #menu a{ text-decoration: none; } (fjerner understregning på links
> placeret i et element med id-værdien menu (fx <div id="menu">).

Den sidste løsning valgte jeg, indlagt i et stylesheet, og i denne udgave:
#menu a:hover{ color: white; }. Den tilsidesætter så standarden for body,
som er sat til rød. En nem og elegant løsning, som kun tog et øjeblik.
Reparationsarbejdet med menuen bliver derimod nok et større arbejde - men
der er langt til midnat endnu.
Endnu engang tak.
HansJ



Hans Jørgen Lassen (14-03-2005)
Kommentar
Fra : Hans Jørgen Lassen


Dato : 14-03-05 23:27

"Jens Gyldenkærne Clausen" skrev:

> Det kan du evt. få hjælp til i clientside-gruppen. Problemet er at du
> tilgår nogle html-elementer direkte. Brug document.getElementById i
> stedet - så virker det i alle nyere browsere. Hvis gamle IE-udgaver skal
> med, kan du kombinere med document.all.

Fandt en brugbar, tilpasselig menu på
http://www.dynamicdrive.com/dynamicindex1/hvmenu/index.htm

- og den virker også i FF.

Hilsen,
Hans Jørgen



Søg
Reklame
Statistik
Spørgsmål : 177560
Tips : 31968
Nyheder : 719565
Indlæg : 6408946
Brugere : 218888

Månedens bedste
Årets bedste
Sidste års bedste