PDA

View Full Version : Mouseover


indianleo
11-12-2007, 01:30 AM
Hello Friends Can we changes the bg color of a cell on mouseover on TEXT without using image

neonfluxx
11-12-2007, 05:34 AM
Yes sir use CSS:

a:hover {
background-color: #000000; <------the color you want
}

davidj
11-12-2007, 07:36 AM
i thought a:hover was specific to an <a> tag

im not sure about this though

i have used a class to do this in the past


.classname{

background-color: #000000; <------the color you want


}

neonfluxx
11-12-2007, 07:50 AM
I put the hover DJ because he said "mouseover". So i am assuming it is a link. But I could be wrong.

davidj
11-12-2007, 07:55 AM
i would just assign the class to the <td>

i think you use the style.className method

neonfluxx
11-12-2007, 08:06 AM
but what about the action he wants specifically on mouse over. the class method wouldn't change on that action. You need an advanced Id to name the action.

davidj
11-12-2007, 08:12 AM
<tr class="txt-form-label" onMouseOver="this.className='cellcolour-class'">



.cellcolour-class {
background-color: #FFC68C;
cursor:pointer;
}

neonfluxx
11-12-2007, 08:20 AM
Yes yes yes you could, Now the question is, Is it a link or not and then he has two way to accomplish this now. lol

domedia
11-12-2007, 04:02 PM
Actually, a technique I like, is to use both.
Nice when you have a large box you want to be a link, but the anchor tag is inside the div. :) And in Leo's case maybe replace the DIV with a TD?


<script type="text/javascript">
<!--
function gurl(d) {
document.location.href="http://www.yoursite.com"+d; return false;
}
// -->
</script>
<style type="text/css">
<!--
.glow { cursor:pointer; border: 1px solid #FF9900; background-color:#FFFAE6;}
.box { border: 1px solid green;}
-->
</style>
<div onclick="gurl('/file.html');" class="box" onmouseover="this.className='glow'" onmouseout="this.className='box'">
<a href="/file.html">Something</a>
</div>

Cary
11-12-2007, 11:35 PM
And another way (if it's just to change cell colors)...

<style type="text/css">
body {
behavior:url("csshover.htc"); /* from http://www.xs4all.nl/%7Epeterned/csshover.html */
}
td.change {
background-color: red;
color: #FFFFFF;
}
td.change:hover {
background-color:#CCCCCC;
color: red;
}
</style>


<td class="change">Hello!</td>

indianleo
11-16-2007, 01:26 PM
hello friends I had tried changing cell color but i didnt get please help me step by step

domedia
11-16-2007, 01:56 PM
You've been given exact code to use for 3 different approaches.
Where are you stuck?

indianleo
11-16-2007, 04:24 PM
I added the code in Body that but the cell does not change on mouseover

domedia
11-16-2007, 06:09 PM
you have to be way more specific than that leo, you should know that already, you're not that new here :)

indianleo
11-17-2007, 02:01 PM
I am really sorry but pls can u tell me step by step coz the cell color is not changing so how to change suppose current color I want white and text color Balck and on mouseover it should reverse

domedia
11-17-2007, 03:50 PM
Leo, this isn't funny anymore, you've been given actual cut and paste code for this. And not only once, but for 3 different approaches by 3 different people.

Steps:
1. Cut
2. Paste

This thread has reached it's maximum benefit for the community at this point, so closing thread.

davidj
11-19-2007, 09:31 AM
some people shouldnt be allowed to switch computers on