So I have a table on which I want to capture its scroll event as we capture scroll event on window. I want to capture scroll event when its body scrolls as it as some fixed height and overflow:scroll will be preset:

Fiddle here

Below is what I've tried but with no success:

$('tbody').on('scroll',function(){
    alert('hellow');
});

I am not sure the above code is correct or not. I mean not sure whether there is any event like this for table.

Are there any alternatives to capture scroll events of table body. The main reason being here is fixed table header which works fine in chrome and other browsers but not in IE8 as it jumps and takes time to get fixed again!

So I have a table on which I want to capture its scroll event as we capture scroll event on window. I want to capture scroll event when its body scrolls as it as some fixed height and overflow:scroll will be preset:

Fiddle here

Below is what I've tried but with no success:

$('tbody').on('scroll',function(){
    alert('hellow');
});

I am not sure the above code is correct or not. I mean not sure whether there is any event like this for table.

Are there any alternatives to capture scroll events of table body. The main reason being here is fixed table header which works fine in chrome and other browsers but not in IE8 as it jumps and takes time to get fixed again!

• javascript
• jquery
• html
• css

2 Answers 2

Try this, that have to work in IE8:

$('tbody').bind('mousewheel DOMMouseScroll', onWheel);

function onWheel (e){    
    console.log(e);
}

jsFiddle

There is another way to trigger this event. The table from which you want to apply this event, from there itself you can call a JavaScript function.

For example:

<table onscroll="yourFunction()"></table>

and then you can write your code in the yourFunction() function in the script tags.