Jag har en tabell med diverse celler. I varje cell finns en länk och till denna länk hade jag tänkt att bakgrundsfärgen på cellen ska ändras när man trycker på länken, hur gör jag detta? Skriv gärna in flera alternativ. Har själv försökt, men utan godtyckligt resultat...
Länkar och CSS
2 svar · 228 visningar · startad av Virrdo
Så här kanske:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
<script language="JavaScript" type="text/javascript">
<!--
function color(vilken,bla){
//document.write(vilken,bla)
document.getElementById(vilken).style.backgroundColor = bla
}
//-->
</script>
</head>
<body>
<table border="1" width="200">
<tr>
<td id="one"><a href="javascript:void(0)" onClick="color('one','red')">Röd</a></td>
<td id="two"><a href="javascript:void(0)" onClick="color('two','blue')">Blå</a></td>
<td id="three"><a href="javascript:void(0)" onClick="color('three','green')">Grön</a></td>
<td id="four"><a href="javascript:void(0)" onClick="color('four','purple')">Lila</a></td>
</tr>
</table>
</body>
</html>
Om du vill låta bli att använda javascript (eftersom detta är postat i html/css forumet :) ), så kommer här en ren css-lösning:
<style type="text/css">
.box {
background:#333;
border:1px solid #000;
width:200px;
color:#000;
padding: 5px;
text-align:center;
}
.box a
{
display: block;
}
.box a:hover
{
background:#cccccc;
color:#000;
width:100%;
}
</style>
Och på sidan:
<table>
<tr>
<td class="box">
<a href="lank.htm">Min länk</a>
</td>
</tr>