Question

I’ve come across a problem in Firefox browser. It’s likely a bug, but maybe someone knows a workaround. The problem is demonstrated in the following JSFiddle: http://jsfiddle.net/F5tdB/ This has been tested on Firefox 12.0, 15.0.1, 16.0.1.

To explain it in words… You have to follow this sequence of events:

1. Get an element with overflow:auto and some overflowing contents, then scroll it a bit;
2. Hide the element (display: none);
3. Remove contents
4. Show the element (it’s empty now)
5. Re-add the same contents (it’s scrolled now, just as it was before)
6. Reset scrollTop/scrollLeft to 0 via Javascript.

As a result, the contents do get scrolled to the proper position, but the scrollbar stays as it was, which is clearly wrong.

Is there any workaround to this short of removing/re-adding the element instead of just hiding it?

Answer 1

In testing I discovered that if you set scrollTop to any value other than 0 (or its current value) then it updates the scrollbar correctly. You can then immediately set scrollTop to 0.

Particularly as you have a test case you should of course file a bug in Bugzilla.