468,244 Members | 1,965 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 468,244 developers. It's quick & easy.

change color in row

sr
please help
i have problem:
I know how to change color row in table when my mouse is over on this row
and change color to another color when my mouse is out from this row.
but i dont know how to change color when i click on this row and change to
third color and ,this color stay when my mouse is out.please help
Oct 12 '06 #1
6 3708
sr <sr@opgk.koszalin.plwrote:
please help
i have problem:
I know how to change color row in table when my mouse is over on this row
and change color to another color when my mouse is out from this row.
but i dont know how to change color when i click on this row and change to
third color and ,this color stay when my mouse is out.please help
You could call a function on the mouseOut-Event which checks the
background color of the row. And then you can decide what to do:

function colorCheck(object) {

// get background color of object
var bgColor = object.style.backgroundColor;

// if background color is NOT yellow change it to white
if ( bgColor != 'rgb(255, 255, 0)' ) {
object.style.backgroundColor = '#ffffff';
}
}

HTH
../otto
--
http://www.wean.at +++ http://www.lang-kritz.at
:wq
Oct 12 '06 #2
Otto Lang wrote on 12 okt 2006 in comp.lang.javascript:
var bgColor = object.style.backgroundColor;
if ( bgColor != 'rgb(255, 255, 0)' ) {
<div style='background-color:yellow;'
onclick='alert(this.style.backgroundColor)'>
xxxxxxxxxxxx</div>

The above in IE6 and FF1.5 will alert: "yellow"

<div style='background-color:#f00;'
onclick='alert(this.style.backgroundColor)'>
xxxxxxxxxxxx</div>

will in IE 6alert #f00
in FF1.5 rgb(255, 0, 0)
<div style='background-color:rgb(255, 255, 0);'
onclick='alert(this.style.backgroundColor)'>
xxxxxxxxxxxx</div>

The above in IE6 will alert: "rgb(255,255,0)"
and in FF1.5 will alert: "rgb(255, 255, 0)"
[mind the spaces]

==========

So your test will not be cross browser, and probably not in browser
dependable.

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)
Oct 12 '06 #3
Evertjan. <ex**************@interxnl.netwrote:
So your test will not be cross browser, and probably not in browser
dependable.
Sorry, such mistakes are not good :( I've forgotten IE and the named
colors. So he will have to make a lot more of tests to get the function
working: And maybe a lot more of tests for Safari and other browsers

../otto
Oct 12 '06 #4
Otto Lang wrote on 12 okt 2006 in comp.lang.javascript:
Evertjan. <ex**************@interxnl.netwrote:
>So your test will not be cross browser, and probably not in browser
dependable.

Sorry, such mistakes are not good :( I've forgotten IE and the named
colors. So he will have to make a lot more of tests to get the function
working: And maybe a lot more of tests for Safari and other browsers
What can be done however is this, IE6 and FF1.5 tested:

<style>
..red {background-color:#ff0000;}
..blueish {background-color:#01e;}
</style>

<div class='red'
onclick='alert((this.className=="red")?"A red color":"Another color")'>
xxxxxxxxxxxx</div>

<div class='blueish'
onclick='alert((this.className=="red")?"A red color":"Another color")'>
xxxxxxxxxxxx</div>

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)
Oct 12 '06 #5
Evertjan. <ex**************@interxnl.netwrote:
What can be done however is this, IE6 and FF1.5 tested:

<style>
.red {background-color:#ff0000;}
.blueish {background-color:#01e;}
</style>

<div class='red'
onclick='alert((this.className=="red")?"A red color":"Another color")'>
xxxxxxxxxxxx</div>

<div class='blueish'
onclick='alert((this.className=="red")?"A red color":"Another color")'>
xxxxxxxxxxxx</div>
Yes, class names seem to be a good idea. This should also work with
Safari an NetKit-based browsers. I'll test it in the evening when I'm
back at my Mac.

../otto
Oct 12 '06 #6
Evertjan. <ex**************@interxnl.netwrote:
What can be done however is this, IE6 and FF1.5 tested:

<style>
.red {background-color:#ff0000;}
.blueish {background-color:#01e;}
</style>

<div class='red'
onclick='alert((this.className=="red")?"A red color":"Another color")'>
xxxxxxxxxxxx</div>

<div class='blueish'
onclick='alert((this.className=="red")?"A red color":"Another color")'>
xxxxxxxxxxxx</div>
Okay, I tested this option on the Mac with IE 5.2, FF 1.5 and Safari 2
and it works with all of them properly. So I think the OP can use
className to decide how to change the background color.

../otto
Oct 12 '06 #7

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

4 posts views Thread by J.C. Flores | last post: by
8 posts views Thread by Patrick Kowalzick | last post: by
3 posts views Thread by roger beniot | last post: by
1 post views Thread by Anthony Boudouvas | last post: by
reply views Thread by NPC403 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.