CODEWITHSUNDEEP
javascripthtmljquerycss
lxg95
lxg95

Reputation: 573

How to scroll with jQuery (Bottom of element should be at the bottom of the page)

On my HTML page, I have stuff that can be added dynamically by a button. When the stuff that is added is not in the viewport anymore, I want to scroll to get it into the viewport. As the added content is always added below the clickable button that adds the stuff i always want to have the bottom of the element to be at the bottom of the viewport after scrolling, but i am just able to put the top of the element at the top of the viewport with that function:

if (!elementInViewport(document.getElementById("ElementId"))){
    $([document.documentElement, document.body]).animate({
        scrollTop: $("#ElementId").offset().top
    }, 2000);
}

There is no scrollBottom instead of scrollTop and when I replace the offset().top with offset().bottom the function doesn't do anything at all.

How can I do that?

Upvotes: 2

Views: 77

Answers (1)

ATP
ATP

Reputation: 3249

Try the scrollIntoView() function:

if (!elementInViewport(document.getElementById("ElementId"))){
   document.getElementById("ElementId").scrollIntoView(false);
}

Upvotes: 1

Related Questions