Jquery scrollTop goes to the wrong position

Question

Inside a div with scroll, when I press the button CLICK ME, the script below should scroll to the text "SHOULD GO HERE". Something similar to an anchor link.

JsFiddle: https://jsfiddle.net/hhqnjojr/2/

Instead, the script scrolls to a random position (?) way above the text "SHOULD GO HERE". Please, what am I doing wrong?

$("#my_button").click(function() {
    $('#wrapper_div').animate({
        scrollTop: $("#go_here").offset().top
    }, 2000);
});

Something is amiss here. `offset()` returns the element's position *relative to the document*, but you're applying `scrollTop()` to a `
` element instead of `window`. The coordinate systems won't agree with each other. — Frédéric Hamidi, Jan 25 '16 at 16:24
Any ideeas welcomed... Anything elese I could use instead of offset() ? — Malasorte, Jan 25 '16 at 16:27
`position()`, *maybe*, depending on the offset parent of `#go_here`. — Frédéric Hamidi, Jan 25 '16 at 16:28

score 4 · Answer 1 · answered Jan 25 '16 at 16:34

4

position: relative on the #wrapper_div seems to work. of course it doesn't scroll anywhere if you are already at the bottom. And use position() instead of offset() i believe.

answered Jan 25 '16 at 16:34

Nate

121
5

you made my day(has app into add-in extension in the MS Word and this stuff is running on IE11, so a lot of default approaches does not work or works with interesting behavior) – Medvedev A. Jul 05 '19 at 16:17

score 0 · Accepted Answer · answered Jan 25 '16 at 16:30

0

$window.scrollTo(0, 0);

Write this in your click event ,this will move to top, give the position according to your requirement.

answered Jan 25 '16 at 16:30

Sajid Syed

34
5

Jquery scrollTop goes to the wrong position

2 Answers2

Linked