Rubikzube said:
I have JavaScript functions on my page that insert and
remove DOM elements, and it's causing the browser to
rescroll to the top of the window.
Then you have a mistake in your code. Without seeing the code the balance of
probability is that you are using the onclick handler of a link to trigger
the code where the link has an HREF consisting of '#' and the onclick
handler does not cancel the default action of the link (which is to navigate
to the URL specified by the HREF and the '#' HREF ends up being the URL of
the start of the current document (technically because '#' is an
unrecognised fragment identifier and the rest of the URL is an empty string,
where the empty string, as a URL, is defined as being the 'start of the
current document', where 'start' is usually interpreted as 'top' in visual
web browsers).
I was wondering what the cause of the behavior is
Probably as described.
and if there is a smooth workaround.
Doing things properly is not a workaround. The best approach (given a link
as a triggering element) is to cancel the navigation, which is most simply
achieved by returning false from the onclick handler. If you had posted the
actual code I would have shown you the suitable formulation for you
situation, but doing some research should find a workable example.
On the other hand, as links are intended to mean/imply navigation it is
often felt that they should not be used for triggering scripts. And then
<input type="button> or <button type="button"> elements become the obvious
choice. As neither navigate (or have any other default action) side effects
are eliminated by their use.
The rescroll is happening after the insertion function,
and using a setTimeout is just making the page shake.
It is much more useful to the people you are asking help from to show them
these things rather than just talking about them.
Richard.
