jquery - Showing/hiding elements in row when hovering the row -
i have html table create using angular-datatables. html table looks this
<table ng-if="devicesloaded()" datatable="ng" class="device-table table table-hover" dt-options="dtoptions" dt-column-defs="dtcolumndefs"> <thead> <tr> <th>id</th> <th ng-repeat="key in getparameterscolumns()">{{key | capitalize}}</th> <th></th> </tr> </thead> <tbody> <tr class="no-border" ng-repeat="item in data"> <td>{{item.id}}</td> <td>{{item.name}}</td> <td>{{item.description}}</td> <td>{{item.type}}</td> <td> <i class="fa fa-download action-icon" tooltip="download" ng-click="download(item)"> </i> </td> </tr> </tbody> </table>
i want <i>
element (the download button) appear when specific row hovered. please note - not when hovering specific item or td, when hovering on every point in row.
you should able hover:
tr.no-border i.action-icon{ display:none; } tr.no-border:hover i.action-icon{ display:block; }
Comments
Post a Comment