Notifikationer

Markér alle som læst Log ud

07. maj 2006 - 09:39 Der er 22 kommentarer og
1 løsning

ahover på enkelte celler i tabel

Hvordan laver jeg hele cellen til et link og ikke kun tekstlinket?

Jeg kan ikke gøre det i css'en da det ikke skal gælde for alle celler men kun nogle enkelte.

Sådan ser det ud nu:

<td>
<a href="http://www.tjulahop.com/forside.htm">
TILBAGE TIL<BR>
FORSIDEN<BR>
(HOME)
</a>
</td>

/DFL

Synes godt om

denflinkelaanehaj Nybegynder

07. maj 2006 - 09:41 #1

Det der skal ske ved ahover er samme effekt som ved tekstlinks, og som er følgende:

A{color:#000000; font-family:tahoma; font-size: 9px; font-weight:none; text-decoration:none; }
A:Visited{color:#000000; font-family:tahoma; font-size: 9px; font-weight:none; text-decoration:none; }
A:Hover{color:#000000; font-family:tahoma; font-size: 8px; font-weight:bold; text-decoration:none; }

Synes godt om

twotimes Nybegynder

07. maj 2006 - 09:42 #2

jo jo.
Du kan bare give den enkelte celle en id="dincelle"

og så ellers tilføje det css du skal bruge sådan:

#dincelle{
bla bla

}

eller du kan bruge class="dincelle" og så

.dincelle {
bla bla
}

Synes godt om

twotimes Nybegynder

07. maj 2006 - 09:54 #3

forstår ikke helt hvad du mener med at gøre hele cellen til et link. Er det al teksten i cellen der skal være et link. Eller er det hele cellens flade..?

Synes godt om

denflinkelaanehaj Nybegynder

07. maj 2006 - 09:59 #4

det er hele cellens flade

Synes godt om

denflinkelaanehaj Nybegynder

07. maj 2006 - 10:00 #5

ja altså - når man holder musen hen over hvilketsomhelst sted i cellen skal teksten ændres og hele molevitten skal være et link

Synes godt om

twotimes Nybegynder

07. maj 2006 - 10:07 #6

hvad med at ligge et billede ind i tabellen evt sådan her:

<td>

<div Style="position:absolute;z-index:1>
<a href="http://www.tjulahop.com/forside.htm">
<img src="white.gif" height="dintabelhøjde" width="dintabelbredde">
</a>
</div>

<div Style="position:absolute;z-index:2>
TILBAGE TIL<BR>
FORSIDEN<BR>
(HOME)
</div>

</td>

billedet white.gif skal så bare være én pixel i den farve din tabel baggrund skal være

Synes godt om

twotimes Nybegynder

07. maj 2006 - 10:09 #7

hov nu ændrer teksten sig godt nok ikke.

Synes godt om

twotimes Nybegynder

07. maj 2006 - 10:12 #8

Ellers ku du lave et billede med teksten i en firkant som det skal se ud normal, og ét som det skal se ud ved mouse over.

Så for du den effekt du vil have, men du skal så indsætte noget javascript til gengæld

Synes godt om

denflinkelaanehaj Nybegynder

07. maj 2006 - 10:12 #9

Nej det duer ikke med et billede eftersom teksten i cellen ofte skal kunne ændres uden man behøver lave et nyt billede hver gang.
Og det er jo netop teksten der skal ændre sig ved ahover...

Synes godt om

twotimes Nybegynder

07. maj 2006 - 10:12 #10

får

Synes godt om

mclemens Nybegynder

07. maj 2006 - 10:40 #11

Noget i denne stil?

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="content-type" content="text/html; charset=iso-8859-1"><title>Ingen titel</title>

<script type="text/javascript">

links=new Array('http://www.eksperten.dk','http://www.dr.dk')

window.onload=function(){
tds=document.getElementsByTagName("td");
for(i=0;i<tds.length;i++){
if(tds[i].className=="atd"){
tds[i].onmouseover=function(){this.style.font='bold 8px tahoma';};
tds[i].onmouseout=function(){this.style.font='normal 9px tahoma';};
tds[i].onclick=function(){window.location.href=links[(this.id.replace("l",""))];}
}
}
}
</script>

<style type="text/css">
.atd{color:#000; font:9px tahoma;}
</style></head>

<body>

<table>
<tr>
<td>ABC</td>
<td class="atd" id="l0">DEF</td>
</tr>
<tr>
<td>ABC</td>
<td class="atd" id="l1">DEF</td>
</tr>
</table>

</body></html>

Synes godt om

mclemens Nybegynder

07. maj 2006 - 10:50 #12

muligvis med onclick skiftes til denne...
tds[i].onclick=function(){window.open(links[(this.id.replace("l",""))],"_blank");}

(onclick kan selvfølgelig også sættes direkte på td'en via.
onclick="window.open('http://www.eksperten.dk','_blank');"
istedet for array og onclick funktions tildeling - så sparer man også id

Synes godt om

denflinkelaanehaj Nybegynder

07. maj 2006 - 11:21 #13

mclemens> YES!

Men nu er jeg rendt ind i nye problemer...
For det første er det kun de to første celler der overhovedet er tekst i.
Hvorfor nu det?

Der hvor du skriver "_blank" ender med at skulle være en iframe, men det er vel bare at skrive navnet på den rigtige iframe?

Der er omtrent 10 forskellige celler der jo skal kalde forskellige sider frem.

Hvor hulen definerer jeg de sider der skal aktiveres??
Altså id="l0" og id="l1" og id="l2" ... og id="l10"

Synes godt om

denflinkelaanehaj Nybegynder

07. maj 2006 - 11:24 #14

nej hov... det er ikke de to første celler der er tekst i - det er simpelthen kun celle 1 og celle 10 der er tilbage - alle dem der stod ind imellem er forsvundet.
Nu er det hele jo noget rod!

Synes godt om

mclemens Nybegynder

07. maj 2006 - 11:32 #15

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="content-type" content="text/html; charset=iso-8859-1"><title>Ingen titel</title>

<script type="text/javascript">

window.onload=function(){
tds=document.getElementsByTagName("td");
for(i=0;i<tds.length;i++){
if(tds[i].className=="atd"){
tds[i].onmouseover=function(){this.style.font='bold 8px tahoma';};
tds[i].onmouseout=function(){this.style.font='normal 9px tahoma';};
}
}
}
</script>

<style type="text/css">
.atd{color:#000; font:9px tahoma;}
</style></head>

<body>

<table>
<tr>
<td>ABC</td>
<td class="atd" onclick="document.frames.test.location.href='http://www.tv2.dk';">DEF</td>
</tr>
<tr>
<td>ABC</td>
<td class="atd" onclick="document.frames.test.location.href='http://www.dr.dk';">DEF</td>
</tr>
</table>

<iframe name="test" src="a.html"></iframe>

</body></html>

Synes godt om

mclemens Nybegynder

07. maj 2006 - 11:35 #16

[ nej hov... det er ikke de to første celler der er tekst i - det er simpelthen kun celle 1 og celle 10 der er tilbage - alle dem der stod ind imellem er forsvundet.
Nu er det hele jo noget rod! ]
... forstår ikke???
- hos mig vises cellerne og indholdet fint... er det mit eksempel du snakker om ... hvis ikke lyder det at enkelte tag defineringer ikke er lukket... kast evt. et eksempel der giver fejlen ...

Synes godt om

mclemens Nybegynder

07. maj 2006 - 11:36 #17

document.frames.test.location.href
->
window.test.location.href

Synes godt om

denflinkelaanehaj Nybegynder

07. maj 2006 - 12:00 #18

den sidste bemærkning lige ovenover denne kommentar forstår jeg ikke.
Hvor skal det stå?

Nu virker det hele - bortset fra at der ikke sker en disse når jeg klikker på linket ??

Jeg har følgende:

<head>

<style>

</style>

<STYLE TYPE='text/css'>
/* CSS generated at csscreator.com */
FONT{color:#000000; font-size: 12px; font-family:tahoma; font-weight:bold; text-decoration:none; }
DIV{ color:#000000; font-family:tahoma; font-size: 12px; font-weight:bold; text-decoration:none; }
A{color:#000000; font-family:tahoma; font-size: 9px; font-weight:none; text-decoration:none; }
A:Visited{color:#000000; font-family:tahoma; font-size: 9px; font-weight:none; text-decoration:none; }
A:Hover{color:#000000; font-family:tahoma; font-size: 8px; font-weight:bold; text-decoration:none; }
.atd{color:#000000; font-family:tahoma; font-size: 9px; font-weight:none; text-decoration:none; }
</STYLE>

<script type="text/javascript">

window.onload=function(){
tds=document.getElementsByTagName("td");
for(i=0;i<tds.length;i++){
if(tds[i].className=="atd"){
tds[i].onmouseover=function(){this.style.font='bold 8px tahoma';};
tds[i].onmouseout=function(){this.style.font='normal 9px tahoma';};
}
}
}
</script>

</head>

<BODY bgcolor="#000000" LEFTMARGIN=0 TOPMARGIN=0 MARGINWIDTH=0 MARGINHEIGHT=0>

<center>

<div>
 <br>
</div>
<table width=975 height=550 background="http://www.hjemmesidensnavn.com/atest/bg.jpg" border=0 cellpadding=0 cellspacing=0>

<tr>

<td valign="top" align="left">
<div>

<center>
<table width=974 height=10 border=1 cellpadding=0 cellspacing=0>

<tr height=10>
<td colspan=11>

</td>

</tr>

<tr height=38>

<td width=137><div>

</td>

<td width=81 align=center valign=center class="atd" onclick="document.frames.test.location.href='http://www.dr.dk';">
TILBAGE TIL<BR>
FORSIDEN<BR>
(HOME)
</td>

<td width=81 align=center valign=center class="atd" onclick="document.frames.test.location.href='http://www.tv2.dk';">
CELLE 2
</td>

<td width=81 align=center valign=center class="atd" onclick="document.frames.test.location.href='http://www.eksperten.dk';">
CELLE 3
</td>

<td width=81 align=center valign=center class="atd" onclick="document.frames.test.location.href='http://www.tv3.dk';">
CELLE 4
</td>

...osv.

Synes godt om

mclemens Nybegynder

07. maj 2006 - 12:38 #19

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="content-type" content="text/html; charset=iso-8859-1"><title>Ingen titel</title>

<head>

<style>

</style>

<STYLE TYPE='text/css'>
/* CSS generated at csscreator.com */
FONT{color:#000000; font-size: 12px; font-family:tahoma; font-weight:bold; text-decoration:none; }
DIV{ color:#000000; font-family:tahoma; font-size: 12px; font-weight:bold; text-decoration:none; }
A{color:#000000; font-family:tahoma; font-size: 9px; font-weight:none; text-decoration:none; }
A:Visited{color:#000000; font-family:tahoma; font-size: 9px; font-weight:none; text-decoration:none; }
A:Hover{color:#000000; font-family:tahoma; font-size: 8px; font-weight:bold; text-decoration:none; }
.atd{color:#000000; font-family:tahoma; font-size: 9px; font-weight:none; text-decoration:none; }
</STYLE>

<script type="text/javascript">

window.onload=function(){
tds=document.getElementsByTagName("td");
for(i=0;i<tds.length;i++){
if(tds[i].className=="atd"){
tds[i].onmouseover=function(){this.style.font='bold 8px tahoma';};
tds[i].onmouseout=function(){this.style.font='normal 9px tahoma';};
}
}
}
</script>

</head>

<BODY bgcolor="#000000" LEFTMARGIN=0 TOPMARGIN=0 MARGINWIDTH=0 MARGINHEIGHT=0>

<center>

<div>
 <br>
</div>
<table width=975 height=550 background="http://www.hjemmesidensnavn.com/atest/bg.jpg" border=0 cellpadding=0 cellspacing=0>

<tr>

<td valign="top" align="left">
<div>

<center>
<table width=974 height=10 border=1 cellpadding=0 cellspacing=0>

<tr height=10>
<td colspan=11>

</td>

</tr>

<tr height=38>

<td width=137><div>

</td>

<td width=81 align=center valign=center class="atd" onclick="window.test.location.href='http://www.dr.dk';">
TILBAGE TIL<BR>
FORSIDEN<BR>
(HOME)
</td>

<td width=81 align=center valign=center class="atd" onclick="window.test.location.href='http://www.tv2.dk';">
CELLE 2
</td>

<td width=81 align=center valign=center class="atd" onclick="window.test.location.href='http://www.eksperten.dk';">
CELLE 3
</td>

<td width=81 align=center valign=center class="atd" onclick="window.test.location.href='http://www.tv3.dk';">
CELLE 4
</td>
</tr>
</table>

<iframe name="test" src="a.html"></iframe>

</body></html>

Synes godt om

denflinkelaanehaj Nybegynder

07. maj 2006 - 13:10 #20

Fantastisk!

Jeg har et spørgsmål mere og du virker som om det er lige i din boldgade, men dem stiller jeg seperat - du har jo svaret på dette spm. =)

Svarer du lige så jeg kan give points?

Synes godt om

mclemens Nybegynder

07. maj 2006 - 13:50 #21

[ Jeg har et spørgsmål mere og du virker som om det er lige i din boldgade, men dem stiller jeg seperat - du har jo svaret på dette spm. =) ]
... er lige ved noget dom så det er nok bedst at stille spørgsmålet seperat ... der er sikkert en anden der er klar ved tasterne ...

og ... svar :)

Synes godt om

denflinkelaanehaj Nybegynder

07. maj 2006 - 14:04 #22

Jamen værsgo' så er der points, og hvis du alligevel får tid en dag og ingen andre har svaret så er det nye spørgsmål her:

http://www.eksperten.dk/spm/707801

;)

1000 tak for hjælpen!

Synes godt om

mclemens Nybegynder

07. maj 2006 - 15:06 #23

- det var så lidt :)
og tak for point :)

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