admin管理员组

文章数量:1334668

I'm trying to change the background color using this code:

  data.getItemMetadata = function (index)
  {
       if (index === 5)
       {
           return  {cssClasses: "Unverified"};
       }      
   }

It works perfect as long as the index is even. but with odd indexes it has no effect on the background color (it has effect on the font style). I suspect it has something to do with the zebra effect? (I don't know how to disable that)

Thanks.

I'm trying to change the background color using this code:

  data.getItemMetadata = function (index)
  {
       if (index === 5)
       {
           return  {cssClasses: "Unverified"};
       }      
   }

It works perfect as long as the index is even. but with odd indexes it has no effect on the background color (it has effect on the font style). I suspect it has something to do with the zebra effect? (I don't know how to disable that)

Thanks.

Share Improve this question asked Nov 12, 2012 at 13:29 Slime recipeSlime recipe 2,2833 gold badges33 silver badges49 bronze badges
Add a ment  | 

2 Answers 2

Reset to default 7

Your Unverified CSS class gets applied, but has no effect because it's specificity is lower than what is defined in slick-default-theme.css:

.slick-row.odd {
  background: #fafafa;
}

Notice that the selector uses a bination of two classes, which is more specific than your single Unverified class, hence it takes precedence.

You have two options:

  1. Remove the existing rule.
  2. Increase the specificity of your rule by adding .slick-row and placing it after the existing rule in the document, or by adding ! important at the end of your style declaration.

Neither of Tin's answers worked for me.

I was using:

.slick-row[row$="1"], .slick-row[row$="3"], .slick-row[row$="5"], .slick-row[row$="7"], .slick-row[row$="9"] {
  background: #E2E4FF;

}

But adding this to my CSS did:

.slick-row.odd {
  background: #E2E4FF;
}

本文标签: javascriptSlickGrid 20 can39t change row background color in odd indexesStack Overflow