Script werkt niet

Status
Niet open voor verdere reacties.
T

Tijssen

Gebruiker
Lid geworden
31 aug 2009
Berichten
50
Goedeavond,

Het onderstaande script moet de tabelcellen een kleur geven bij de mouseover. Dit gebeurt niet. Weet iemand waarom dit script niet werkt?
Alvast bedankt.

In de head:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>basis.html</title>
<style type="text/css">
hover1 {
background-color:#CCCCFF;
}
hover2 {
background-color:#FFFFFF;
}
.hover1 a, .hover2 a {
padding: 5px;
width: 150px;
}
</style>
</head>


In de body
<body>
<table cellpadding="5" cellspacing="0" border="1">
<tr>
<td width="150" class="hover1" onmouseover="this.className='hover2'"
onmouseout="this.className='hover1'"><a href="pagina 1.html">Naar pagina 1</a></td>
</tr>
<tr>
<td class="hover1" onmouseover="this.className='hover2'"
onmouseout="this.className='hover1'"><a href="pagina 2. html">Naar pagina 2</a></td>
</tr>
</table>
</body>
 
Oh, je script werkt wel hoor. Het is je css die niet klopt:
PHP: 
/* css snippet, not working */
hover1 {
background-color:#CCCCFF;
}
hover2 {
background-color:#FFFFFF;
}
er moet wel een punt ( . ) voor staan bij class-names. Zo dus:
PHP: 
/* css snippet, fixed */
.hover1
{
   background-color:#CCCCFF;
}
.hover2
{
   background-color:#FFFFFF;
}
 
Ja, je CSS moet dit zijn

Code: 
.hover1 {
background-color:#CCCCFF;
}
.hover2 {
background-color:#FFFFFF;
}
.hover1 a, .hover2 a {
padding: 5px;
width: 150px;
}

, maar het kan véél makkelijker:

CSS:

Code: 
.hover {
background-color:#CCCCFF;
}
.hover:hover {
background-color:#FFFFFF;
}
.hover a {
padding: 5px;
width: 150px;
}

HTML: 
<td class="hover"><a href="pagina 1.html">Naar pagina 1</a></td>

[EDIT]
Verrek Vegras, was je me weer voor.
[/EDIT]
 
Status
Niet open voor verdere reacties.
Steun Ons

Nieuwste berichten

Terug
Bovenaan Onderaan