Selection and Focus in FlexGrid

You can use the 'wj-state-focused' pseudo-class to improve accessibility on your FlexGrid controls.

For example, code below shows the selection in grey when it does not contain the focus, and adds an orange outline to the selected cell when the grid does have the focus:

/* style the cell that has focus */
.wj-flexgrid.wj-state-focused .wj-cell.wj-state-selected {
    border: 2px solid orange;
    transition: all 100ms;
}

/* de-emphasize selected cells when the grid doesn't contain the focus */
.wj-flexgrid:not(.wj-state-focused) .wj-state-selected,
.wj-flexgrid:not(.wj-state-focused) .wj-state-multi-selected {
  background: #ddd;
    color: black;
}