not hover when freeze column

[farazsahebdel]

hi when add class table-hover bootstrap

not hover when freeze column

[yidas]

Hi @farazsahebdel,

You can define table-hover for the table class, and the hover will effect for both freeze column and original columns.

For example:

<table class="table table-hover">

[farazsahebdel]

how ? Please explain more

[yidas]

Hi @farazsahebdel,

https://jsfiddle.net/0zc5rpa9/4/

Regards

[farazsahebdel]

Hi @yidas when the mouse goes over a row in the table, it has to be hover, but the columns that are freeze are not hover.

[yidas]

Hi @farazsahebdel,

You may understood, freeze column rows and table rows will both effect hover but they are independent of each other.

Regards

[farazsahebdel]

@yidas Well I want them both to have an effect

[yidas]

Hi @farazsahebdel,

I think that freezing columns and table rows are different concepts.

Regards

[kosuha606]

@farazsahebdel

Did you try to proccess your issue with jquery? Maybe $('.table').mouseenter\mouseout should help. If we will listen for mouseenter and trigger same event on freezed columns.

Did you solve your problem?

[chiahungwang]

1. Add data-index

<tr data-index="0"></tr>
<tr data-index="1"></tr>

2. Add hover event on both tables

$freeze_table = $('.freeze-table');
$clone_table = $('.clone-column-table-wrap');
$clone_table.find('tr').hover(function(){
    $freeze_table.find('tr[data-index='+this.getAttribute('data-index')+']').css('background-color', 'lightyellow');
}, function(){
    $freeze_table.find('tr[data-index='+this.getAttribute('data-index')+']').css('background-color', '');
});
$freeze_table.find('tr').hover(function(){
   $clone_table.find('tr[data-index='+this.getAttribute('data-index')+']').css('background-color', 'lightyellow');
}, function(){
   $clone_table.find('tr[data-index='+this.getAttribute('data-index')+']').css('background-color', '');
});