PDA

View Full Version : mouse over change colour


rph105
11-20-2007, 11:10 PM
ok ive got a box which is black, i want the box to turn grey when the mouse is rolled over it, but i dont want the box to be a link, how can i achieve this

thanks in advance

Cary
11-21-2007, 01:02 AM
What code did you use to create the box?

rph105
11-21-2007, 01:25 AM
its a div tag box?

Cary
11-21-2007, 02:46 AM
Well, let's suppose you used this code for the box:

<div class="box"></div>Then you could use this in your style sheet:

body {
behavior:url("csshover.htc"); /* from http://www.xs4all.nl/%7Epeterned/csshover.html */
}
.box {
background-color:#000000;
width: 50px;
height: 50px;
}
.box:hover {
background-color:#CCCCCC;
}

You need the csshover.htc file in order for this to work with IE6.

davidj
11-21-2007, 06:19 AM
or


.box1 {
background-color:#000000;
width: 50px;
height: 50px;
}

.box2 {
background-color:#CCCCCC;
width: 50px;
height: 50px;

}



<div class="box1" onmouseover="this.className='box2'" onmouseout="this.className='box1'"></div>

rph105
11-21-2007, 09:46 AM
thank yo so much, got that to work

EDIT: HMMM got a problem when i put both this div boxes next to each other i have this huge 10px gap which i dont want, how can i get rid of that, i dont have any padding on the box so what could be the problem

domedia
11-21-2007, 12:59 PM
The 10px gap comes from your code. Investigate your code and look where it might come from.

rph105
11-21-2007, 01:07 PM
The 10px gap comes from your code. Investigate your code and look where it might come from.

whereabouts in the code could it be coming from?

domedia
11-21-2007, 01:16 PM
How are we supposed to know that? :)
Please see the link in my signature about asking for help.