scrollIntoView possible with form submit -> page refresh?

243
July 29, 2017, at 09:25 AM

So I want to scroll back down my page when I press the submit button and the page refreshes using JS. (or HTML CSS methods if there are)

There were a few answers with window.onload but that doesn't work for me. (it works when I click the button and then refresh again, then it goes down my page)

this is my JS now:

const scrollTo = () => {
  window.onload = function() {
    const $results = document.querySelector(`results`);
    $results.scrollIntoView(true);
  };
};
export default () => {
  const $filterbutton = document.querySelector(`.filter_button`);
  $filterbutton.addEventListener(`click`, scrollTo);
};
Answer 1

You could use the

Element.scrollIntoView()

to make an element visible. Also as you are refresing the page, you can add an anchor tag in your html, and use it in the url:

myserver.com/my_page.htm#my_position_in_page
Rent Charter Buses Company
READ ALSO
Drop downs not working on image carousel

Drop downs not working on image carousel

I have a image carousel that fades at: tahoe-luxury-properties

231
Set of layered, transparent elements scrolling at different speeds possible in only CSS?

Set of layered, transparent elements scrolling at different speeds possible in only CSS?

I have a set of three elements set up roughly like this:

234
Why does my div does not recognize the height of custom components inside itself?

Why does my div does not recognize the height of custom components inside itself?

I have a div that has a handful of custom components in it, and I'm trying to put a border around that container, but the container div's height is not affected by it's contents

205
Angular Cards to be the same height in a flex-layout row

Angular Cards to be the same height in a flex-layout row

I have an angular material based uiI am using @material/flex-layout and material cards, so I have a component layout like:

1040