Question

I have a table which needs to be scrollable within a single page. I’ve used a jQuery scrollable table plugin to accomplish this but now I need to figure out how to scroll to a specific row.

I’ve tried a few different methods including:

$.scrollTo($('#rowIWantToScrollTo'));

and

var rowpos = $('#rowIWantToScrollTo').position();

$('#myTable').scrollTop(rowpos.top);

and

$('#rowIWantToScrollTo').scrollIntoView();

And nothing has worked so far.

Answer 1

LIVE DEMO

Here’s how to do it. (You were close).

1) Fetch top offset of element using offset() and .top

2) Scroll to element using ScrollTo

I broke it up a bit for illustration purposes.

Javascript:

$("a").click(function(e){

  var _offset = $(".row9").offset();
  var _topoffset = _offset.top;

  $(".scrollbox").scrollTop(_topoffset);

  e.preventDefault();
});