I am displaying a PageBlockTable with 12 records from a Custom object. And each <apex:column> has its own color code rendered based on the value.

<apex:column headerValue="Field One" width="4%"
             styleClass="{!CASE(a.Field1__c, 'Red', 'red', 'Green', 'green', 'Yellow', 'yellow', 'white')}">
    <apex:outputText >{!a.Field1__c}</apex:outputText>

But, when my mouse pointer hover on any of the rows, it disables all the colors and show a plain white row. But, I want the row to stay how it rendered(different color codes to each table data). Is there any Boolean variable I need to make false or other attributes to add/change?

  • 1
    This is more of a CSS question than a VF question, I think Sep 11 '17 at 23:20
  • I see this: <tr class="dataRow even first highlight ..... when I mouse hover on any of the rows. It changes dynamically. How can I get a hold of it? How to make it not to switch between highlight and non-highlight?
    – Arnold Jr.
    Sep 11 '17 at 23:25
  • You can't change the default SFDC stylesheets... but you can override them. Ergo, a CSS issue. :) Sep 11 '17 at 23:26
  • Seems simple, but as this highlight keeps on changing dynamically on my mouse movement, I cannot inspect the right attribute. :(
    – Arnold Jr.
    Sep 11 '17 at 23:36
  • Use the Chrome console to add it manually Sep 12 '17 at 0:23

You can't "disable" it, but apparently you can countermand it. I've come up with two potential solutions.


Use an important style.

.red, .red.highlight {
    background: red !important;

This will override the Salesforce style sheet.

Toggle "highlight"

You can also remove the class as its added:

<apex:pageBlockTable onrowmouseover="this.classList.remove('highlight')" ...

onRowMouseOver is called after the library does its stuff, and so you'll undo the highlight that it does. There's no noticeable flicker because browsers delay rendering until the end of a JavaScript execution cycle.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.