Grid Focus

Grid focus color is applied by changing the CSS background color properties of focus, row, hover, etc., and changing the background color directly, not grid selection.

You should adjust the priority of each style to suit the current environment and apply it.

//Set focus display
function btnShowFocus() {
gridView.displayOptions.focusVisible = true
}
 
function btnHideFocus() {
gridView.displayOptions.focusVisible = false;
}
 
//Apply focus row style
gridView.displayOptions.useFocusClass = true;
 
//*.css
//Apply focus cell, row color
 
.rg-data-row:hover {
background: #e6f7ff; }
 
.rg-data-cell:hover { 
background: #e6f7ff ;
}
 
.rg-focused-row { 
background: #bae7ff !important;
}
 
.rg-focused-cell { 
background: #bae7ff !important;
}
 
.rg-focused-cell:hover { 
background: #e6f7ff;
}
 
.rg-focused-row:hover { 
background: #e6f7ff ;
}
 
//Change focus row indicator color
.rg-rowindicator-focus { 
background: #bae7ff !important;
}
 
//realgrid-style.css
//Change cell hover color
.rg-body, .rg-fixed-body { 
background-color: #FFFFFF; } 
.rg-body .rg-table tr td, .rg-fixed-body .rg-table tr td { 
border-top: none; 
border-right: 1px solid #D2D5DA; 
border-bottom: 1px solid #D2D5DA; 
border-left: none; 
height: 0px; } 
.rg-body .rg-table tr td:hover, .rg-fixed-body .rg-table tr td:hover { 
background: #ebebeb00; }

Fixed rows selecting