Jquery .scrollTop problems

Question

Hello guys, I am having a small issue with a .scrollTop

The issue is, once the designated button is clicked the screen will move to the element, the scroll works great. But once a user clicks another button in the menu to move to another part, the screen will move down/up toward the element. But will not reach it.

It will move about half way slightly more or slightly less, but will not reach the div, unless the screen is at the top of the screen again.

Does Jquery need something else to fix this bug?

here is the Jquery

<script>
$(".nextbutton").click(function() {
        $(".wrap").animate({
                scrollTop: parseInt($(".title").offset().top)
        }, 2000);
});
</script>

EDIT...

I think a better way to explain this issue is like this,

When the site first loads it is all fine, I click a link and it will take me to the element on the page no problem. But if I am in a random part of the page and I click a link, then it will try to take me to the top of the page and not to the element.

What is the reason it will take me back to the top of the page and not to the element? is it the top in .scrollTop?

I have also gave tried swapping out the ".wrap" with "html, body" or "body" and "html" with the same result.

Answer 1 · 2014-06-08T05:16:56Z

June 8, 2014 5:16am

Have you read this before? http://stackoverflow.com/questions/7717527/jquery-smooth-scrolling-when-clicking-an-anchor-link

I believe it covers what you are inquiring about. Below is the basic example of the solution offered in my link above.

// This code is animating an anchor link jump to another on-page element.
// I have used this code as well as variations of it, and know it works well

$('a').click(function(){
    $('html, body').animate({
        scrollTop: $( $.attr(this, 'href') ).offset().top
    }, 500);
    return false;
});

Welcome to the Treehouse Community

Looking to learn something new?

Adam Smallman

Adam Smallman

Jquery .scrollTop problems

1 Answer

eck

eck