How to appy whole grid row hover effect with leftsplit property enable

We have split the left side first column of the grid and add row hover CSS to highlight the individual row when user hover over.

Unfortunately the grid hover works well with the row except the fixed column row. Fixed column row has separate HTML structure from rest of the grid at right side.

Here is the working example for the same.

Please advice how we can highlight whole row left side fixed column and rest of the grid row together.

Thanks in advance.

Hello, due to the way the grid built its structure, I believe that only via css will not be possible.

I implemented it using the “cellMouseOver” event of the grid, but it doesn’t work satisfactorily, not resulting in the expected behavior. I implemented a similar example via javascript

Here’s your updated example:


Awesome solution. Thanks @DouglasMeirelles indeed only CSS would not possible. Javascript is the way only.