CODEWITHSUNDEEP
jquerycssgoogle-chrome
user2571510
user2571510

Reputation: 11377

jQuery: simple .css line to change background color does not work in Chrome

I am using the following line to conditionally change the background-color of TDs. This works fine in IE and Firefox but in Chrome it doesn't set any color at all.

I also tried to use rgb(255, 255, 0) instead but with the same result for Chrome, using version 33.0.1750.154 m which seems to be the latest one.

Is there a way to make this work in all three browsers ?

My code snippet: 

$('.search').click(function() {
    var value = $(this).text();
    var color = $(this).css('background-color');
    if(color == 'transparent') {
        $('td')
        .css('background-color', '')
        .filter(function(){
            return $(this).text() === value;
        })
        .css('background-color', 'yellow');
//...

Thanks in advance, Tim.

Upvotes: 0

Views: 1199

Answers (2)

user2571510
user2571510

Reputation: 11377

It looks like the checking for "transparent" before setting the background-color was the issue as only IE and FF return the color this way whereas Chrome returns rgba(0, 0, 0, 0).

I changed the if line as follows which works for me - not sure if rgb would work as well: 

//...
if( (color == 'transparent') || (color == 'rgba(0, 0, 0, 0)') ) {
/...

Upvotes: 0

Anees Hikmat Abu Hmiad
Anees Hikmat Abu Hmiad

Reputation: 3560

if you can, check firstly if was any error was happed, you can look at console .. if no error was find, please check the css selector when you inspect element was selected at blue color ... if no, try to set a width, and height.. if now, try to set overflow: hidden, .. if still problem, try to set bg color and class in css file, if work fine, you can try to addClass like

.testColor{
background-color: yellow;
} 

jQuery(".myClass").addClass("testColor");

Good luck

Upvotes: 1

Related Questions