Hi,

Here is my website: http://www.i4-it.be
If I'm f.e. on my homepage I want that my navigationbutton 'home' stays active like my hoverbutton. Does anyone know how I can do this?

Already thanks

Code:
CSS 
/* Navigation */

#nav {
margin-top:33px;
margin-left:5px;
width:444px;
height:32px;
float:left;
}

.home {
width:73px;
height:32px;
float:left;
}

.about {
width:80px;
height:32px;
float:left;
}

.services {
width:94px;
height:32px;
float:left;
}

.portfolio {
width:103px;
height:32px;
float:left;
}

.contact {
width:94px;
height:32px;
float:left;
}

HTML

<div id="nav">

<div class="home">
<a href="index.html" onmouseover="document.getElementById('home').src='img/home_hover.gif'" onmouseout="document.getElementById('home').src='img/home.gif'"><img src="img/home.gif" id="home" style="border:none;"></a>
</div>

<div class="about">
<a href="html/about.html" onmouseover="document.getElementById('about').src='img/about_hover.gif'" onmouseout="document.getElementById('about').src='img/about.gif'"><img src="img/about.gif" id="about" style="border:none;"></a>
</div>

<div class="services">
<a href="html/servweb.html" onmouseover="document.getElementById('services').src='img/services_hover.gif'" onmouseout="document.getElementById('services').src='img/services.gif'"><img src="img/services.gif" id="services" style="border:none;"></a>
</div>

<div class="portfolio">
<a href="html/portfolio.html" onmouseover="document.getElementById('portfolio').src='img/portfolio_hover.gif'" onmouseout="document.getElementById('portfolio').src='img/portfolio.gif'"><img src="img/portfolio.gif" id="portfolio" style="border:none;"></a>
</div>

<div class="contact">
<a href="html/contact.html" onmouseover="document.getElementById('contact').src='img/contact_hover.gif'" onmouseout="document.getElementById('contact').src='img/contact.gif'"><img src="img/contact.gif" id="contact" style="border:none;"></a>
</div>
</div>