I can’t answer the “should you” part of whether to use refs for this instead other than if you do, you don’t need those id values unless you use them for something else. But here’s how you would: Use useRef(null) to create the ref. const activeSlideRef = useRef(null); Put it on the Slide that’s currently … Read more
try this : document.getElementById(‘myID’).scrollIntoView({ behavior: ‘auto’, block: ‘center’, inline: ‘center’ }); refer here for more information and options : https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollIntoView
The block option decides where the element will be vertically aligned inside the visible area of its scrollable ancestor: Using {block: “start”}, the element is aligned at the top of its ancestor. Using {block: “center”}, the element is aligned at the middle of its ancestor. Using {block: “end”}, the element is aligned at the bottom … Read more
In most modern browsers (Chrome and Firefox, but not Safari, UC, or IE) you can pass options in an object to .scrollIntoView(). Try this: elm.scrollIntoView({ behavior: ‘smooth’, block: ‘center’ }) Other values are behavior: ‘instant’ or block: ‘start’ or block: ‘end’. See https://developer.mozilla.org/en/docs/Web/API/Element/scrollIntoView
There is no scrollEnd event, but you can listen for the scroll event and check if it is still scrolling the window: var scrollTimeout; addEventListener(‘scroll’, function(e) { clearTimeout(scrollTimeout); scrollTimeout = setTimeout(function() { console.log(‘Scroll ended’); }, 100); });
It is supported yes, but user experience is… bad. As @9bits pointed out, this has long been supported by all major browsers. Not to worry about that. The main problem is the way that it works. It simply jumps to a particular element that may as well be at the end of the page. By … Read more
Is there a way to have an offset and make it scroll smoothly? #Yes, but not with scrollIntoView() The scrollIntoViewOptions of Element.scrollIntoView() do not allow you to use an offset. It is solely useful when you want to scroll to the exact position of the element. You can however use Window.scrollTo() with options to both … Read more
jQuery isn’t necessary. Most of the top results I got from a Google search gave me this answer: window.scrollTo(0, document.body.scrollHeight); Where you have nested elements, the document might not scroll. In this case, you need to target the element that scrolls and use it’s scroll height instead. window.scrollTo(0, document.querySelector(“.scrollingContainer”).scrollHeight); You can tie that to the … Read more