Div containers changing background color when hovering over them?

Question

What I am trying to achieve is this:

http://www.pageresource.com/dhtml/jtut6.htm

Except with div containers rather than tables

Can that be achieved?

If so, how?

Could you link me to some tutorials?

Answer 1

Try using the pseudo class ':hover' on your div element in your style sheet. Not sure if it works, but give it a shot and let me know.

<style type="text/css">

div{

background-color:#000;

}

div:hover{

background-color:#FFF;

}

</style>

--------------------------------------...

You can use javascript:

<script type="text/javascript">

function changecolor(id, color) {

element = document.getElementById(id);

event.cancelBubble = true;

oldcolor = element.currentStyle.background;

element.style.background = color;

}

</script>

<div id="myDiv" onMouseOver="changecolor (this.id, '#FFF');" onMouseOut="changecolor (this.id, '#000');">Black to White</div>