Question

In DataTables examples, I see that the mouse cursor changes to indicate a link when hovering above sortable column headers. However, I do not get the same effect in my own project. I configure DataTables like so (with theming by jQuery UI ThemeRoller):

$('#build-table').dataTable({
    'aaSorting': [[1, 'desc'], [0, 'asc'], [2, 'asc']],
    'bJQueryUI': true,
    });

How do I get the mouse cursor behaviour, when hovering above sortable column headers, of the DataTables demos?

EDIT

I know it’s doable with CSS, but wondering if there’s anything out of the box as the DataTable demos all work like this.

Answer 1

I’m not familiar with dataTable() specifically, but the easiest way is to give the sortable columns a class and use the CSS cursor:pointer; property to make the mouse indicate it is clickable.