Checking CSS color with jQuery

Question

Trying to check the border-right-color value with jQuery sorta like so:

if ($(this).css("border-right-color") == "#000") {
    // Do some magic
}

But that doesn't work. console.loging() the value of $(this).css("border-right-color") says rgb(0,0,0).

So, how do I write this conditional check?

Or you can convert rgb to hex explained here: http://stackoverflow.com/questions/1740700/how-to-get-hex-color-value-rather-than-rgb-value — Carol Skelly, May 07 '13 at 23:16
… so you have to quote the string you are comparing it to: `=== "rgb(etc)"` — Quentin, May 07 '13 at 23:17
Oh good grief: `$(this).css("border-right-color") == "rgb(0, 0, 0)"` works.. At least in Chrome. — Wells, May 07 '13 at 23:18

What have you tried · Answer 1 · 2013-05-07T23:26:58.850

0

Use the below function found here

if (rgb2hex($(this).css("border-right-color")) == "#000") {
    // Do some magic
}


function rgb2hex(rgb){
 rgb = rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
 return "#" +
  ("0" + parseInt(rgb[1],10).toString(16)).slice(-2) +
  ("0" + parseInt(rgb[2],10).toString(16)).slice(-2) +
  ("0" + parseInt(rgb[3],10).toString(16)).slice(-2);
}

Take a look here for a working example

edited May 07 '13 at 23:26

answered May 07 '13 at 23:19

What have you tried

11,018
4
31
45

Checking CSS color with jQuery

1 Answers1