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

mkjaer Nybegynder

24. oktober 2005 - 16:35 Der er 12 kommentarer

hover-effekt på en hel tabel

Hej,

Jeg har nogle links, hvor jeg bruger denne style:

.hovedindhold{color: Black;font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;font-size: 11px;font-weight: normal;}
a:active.hovedindhold {text-decoration: none;}
a:visited.hovedindhold {text-decoration: none;}
a:hover.hovedindhold {text-decoration: none; color: Gray;}
a:link.hovedindhold {text-decoration: none;}

Jeg kunne nu tænke mig, at få denne style til at virke på en hel tabel, sådan at al tekst i tabellen får effekten fra hover.hovedindhold, når musen holdes over en tilfældig tekst/grafik i tabellen.

Hvordan gør jeg det?

Hilsen
Martin

Synes godt om

spindoktoren Nybegynder

24. oktober 2005 - 16:38 #1

Så smider du bare en class på din tabel (e.g. <tabel class="hover"></table>) og skriver i CSS:

table.hover td:hover {
text-decoration:none;
color:grey;
}

Så gør den alt tekst, i den celle musen kører over, gråt.

Synes godt om

roenving Novice

24. oktober 2005 - 16:40 #2

-- men det virker ikke i den mest udbredte browser ...

Gør i stedet:

<table onmouseover="this.color='gray';" onmouseout="this.color='';">

Synes godt om

mkjaer Nybegynder

24. oktober 2005 - 19:23 #3

Tak, men det virker ikke helt.

Jeg har forsøgt med denne stump kode:
<table onmouseover="this.color='gray';" onmouseout="this.color='';">
<tr>
<td>
<a href="test.htm">Indhold</a>
</td>
</tr>
</table>

Synes godt om

roenving Novice

25. oktober 2005 - 05:47 #4

Nej, links er noget for sig selv, og skal masseres en hel del mere, men de skal vel stadig være selvstændige links ?-)

Synes godt om

spindoktoren Nybegynder

25. oktober 2005 - 13:09 #5

Bah... hader at det ikke er alle browsere der har fået indbygget de internationale standarder... Men roenving har ret, det er nok en bedre løsning :)

Synes godt om

mkjaer Nybegynder

25. oktober 2005 - 13:43 #6

Det er meningen, at hele tabellen skal sigte på det link, f.eks. test.htm.

mk

Synes godt om

roenving Novice

25. oktober 2005 - 14:02 #7

Hvad skal du så bruge en tabel til ?-)

Synes godt om

mkjaer Nybegynder

25. oktober 2005 - 23:23 #8

Jeg bruger tabellen til, at få en korrekt opsætning af teksten.

F.eks:

<table border="1" width="100%" id="table1">
<tr>
<td>1</td>
<td>3</td>
</tr>
<tr>
<td>2</td>
<td>4</td>
</tr>
</table>

Jeg ønsker som skrevet, at alle tallene påvirkes af en hover-effekt, når musen køres henover et af tallene.

Si'?

Synes godt om

roenving Novice

26. oktober 2005 - 06:59 #9

Gaab, der manglede da også liiige en enkelt ting, prøv f.eks.

<table border="1" width="100%" id="table1" onmouseover="this.style.color='red';" onmouseout="this.style.color='';">
<tr>
<td>1</td>
<td>3</td>
</tr>
<tr>
<td>2</td>
<td>4</td>
</tr>
</table>

-- men det hjælper stadig ikke så meget på links !-)

Synes godt om

mkjaer Nybegynder

26. oktober 2005 - 08:29 #10

Godt ord igen. Det var nu kun et eksempel for at vise hvorfor jeg vil bruge tabels til mine links. Meeen vi laver da lige et 'rigtigt' eksempel.

<table border="1" width="100%" onmouseover="this.style.color='red';" onmouseout="this.style.color='';">
<tr>
<td><a href=link.html>1</a></td>
<td><a href=link.html>3</a></td>
</tr>
<tr>
<td><a href=link.html>2</a></td>
<td><a href=link.html>4</a></td>
</tr>
</table>

Alstå: når jeg klikker på '1' så skal alle 4 links påvirkes af hover-effekten.

Hilsen
Martin

Synes godt om

roenving Novice

26. oktober 2005 - 08:33 #11

Klikker ?-)

Synes godt om

mkjaer Nybegynder

26. oktober 2005 - 09:30 #12

Øhh, kører musen hen over!

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	2	30/10/202409:37	30/10/202413:04
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