How to scroll to the bottom of an element?

user_11512309 0
Viewed 217

I am trying to make the page scroll to the bottom of an element, but I would like to use the bottom of the screen as a reference and not its top.

All scroll API's I know only use the top of the screen as a reference, like this:

element.scrollTo({
  top: 100,
  left: 100,
  behavior: 'smooth'
});

I have the top property, but I'd like something like that:

element.scrollTo({
  bottom: 100,
  left: 100,
  behavior: 'smooth'
});

Of course, this doesn't work, it's just an example. Here I would have the bottom of the screen as a reference and align it with my element's bottom.

Is there anything like that?

I know I could do offsetTop + element's height (or something like that) and use the result as the top value, but I'd like to know if is there a more straightforward way to do that?

webapi scrollview scroll dom javascript
1 Answers

You could try .scrollIntoView():

element.scrollIntoView(false);

or (the same):

element.scrollIntoView({block: 'end'});
user_25703530
Related