Using mousewheel up/down to trigger horizontal scrolling in datatable
Using mousewheel up/down to trigger horizontal scrolling in datatable
I have a very short but very wide datatable and I'm trying to use existing jquery plugins to allow users with mouse wheels to scroll up/down to trigger the scroll action for left/right.
I'm using the jquery example shown here: http://css-tricks.com/snippets/jquery/horz-scroll-with-mouse-wheel/
Example here: http://css-tricks.com/examples/HorzScrolling/
Code here: https://github.com/brandonaaron/jquery-mousewheel
However, even though I can get the plugin to console.log() the event and mousewheel delta, I cannot seem to programatically change the left/right position of the table.
Is there a way to programmatically "bump" my wide table data N pixels to the left (it is set to overflow:scroll)? I have tried to use modify the scrollLeft property of a large number of different layers in the datatable. Does anyone have an example of how to bump my table contents like this?
Note: I'm also using colvis and fixedcolumns (which is a feat in itself), but that shouldn't matter here. My initialization code is:
{
"sDom": 'lfrtip',
"aoColumnDefs": [
{ "bVisible": false, "aTargets": [2] }
],
"aaSorting": [[3,'asc']],
"aaData": aaData,
"aoColumns": aoColumns,
"sScrollX": "100%",
"bScrollCollapse": false,
"bLengthChange": false,
"bPaginate": false,
"bStateSave": true,
"bInfo": false,
"bDeferRender": true,
"bFilter": false,
"bAutoWidth": false,
"bDestroy": true,
"bSort": false
}
Thanks!
Dakota
I'm using the jquery example shown here: http://css-tricks.com/snippets/jquery/horz-scroll-with-mouse-wheel/
Example here: http://css-tricks.com/examples/HorzScrolling/
Code here: https://github.com/brandonaaron/jquery-mousewheel
However, even though I can get the plugin to console.log() the event and mousewheel delta, I cannot seem to programatically change the left/right position of the table.
Is there a way to programmatically "bump" my wide table data N pixels to the left (it is set to overflow:scroll)? I have tried to use modify the scrollLeft property of a large number of different layers in the datatable. Does anyone have an example of how to bump my table contents like this?
Note: I'm also using colvis and fixedcolumns (which is a feat in itself), but that shouldn't matter here. My initialization code is:
{
"sDom": 'lfrtip',
"aoColumnDefs": [
{ "bVisible": false, "aTargets": [2] }
],
"aaSorting": [[3,'asc']],
"aaData": aaData,
"aoColumns": aoColumns,
"sScrollX": "100%",
"bScrollCollapse": false,
"bLengthChange": false,
"bPaginate": false,
"bStateSave": true,
"bInfo": false,
"bDeferRender": true,
"bFilter": false,
"bAutoWidth": false,
"bDestroy": true,
"bSort": false
}
Thanks!
Dakota
This discussion has been closed.