JQuery scroll down to element not up

Question

I use the following to scroll to an item

$("html, body").animate({ scrollTop: $('selector').offset().top }, 500); 

The above code puts an element at the top of the browser window when scrolling to it, is there any way I can go to the element with a scroll ending with the element at the bottom of the browser window?

Answer 1

You can use the height of the window to calculate the scroll position.

Answer 2

Try something like this to place the scroll at the bottom of the item

 $("html, body").animate({ scrollTop: $('selector').offset().top + $('selector').outerHeight(true) }, 500); 

Or this to put an item at the bottom of the scroll:

 $("html, body").animate({ scrollTop: $('selector').offset().top + $('selector').outerHeight(true) -$(window).height() }, 500);