I am using google visualization table to create an html table, and it enables The header row remains fixed as the user scrolls.

I got something working like this: /

The problem I am facing is that, when I click a row to expand the table, it actually redraw the table, so that the scroll bar will always be at the top of the table. Is there anyway I can track the current position of the scroll bar when I click, and set the value back when the table is redrawn?

If it is a scroll bar of the DOM, I can use:

var pos = $('body').scrollTop();
table.draw(view, options);
window.scrollTo(0, pos);

Then how to track the scroll bar inside a div?

I am using google visualization table to create an html table, and it enables The header row remains fixed as the user scrolls.

I got something working like this: http://jsfiddle/RjHMH/114/

The problem I am facing is that, when I click a row to expand the table, it actually redraw the table, so that the scroll bar will always be at the top of the table. Is there anyway I can track the current position of the scroll bar when I click, and set the value back when the table is redrawn?

If it is a scroll bar of the DOM, I can use:

var pos = $('body').scrollTop();
table.draw(view, options);
window.scrollTo(0, pos);

Then how to track the scroll bar inside a div?

• javascript
• jquery
• html
• css
• google-visualization

• Have you tried changing $(body) to $('#myDivId')? – Justinas Commented Nov 12, 2015 at 21:48
• I do tried, the pos is always 0. – chrisTina Commented Nov 12, 2015 at 22:04
• Possible duplicate of Scrolling to a element inside a scrollable DIV with pure Javascript – nu everest Commented Mar 14, 2017 at 15:57

2 Answers 2

document.getElementsByClassName("google-visualization-table")[0].children[0].onscroll = function(){
    console.log(this.scrollTop); //check the number in console
}

The key is to get the div in js, or use jquery, then you can visit the scrollTop of that div.

var currentY = 0;

$(window).scroll(function () {
    currentY = $('selector').offset().top;
    console.log(currentY);
});

To get the position on click:

$(document).click(function () {
    currentY = $('selector').offset().top;
    console.log(currentY);

});