JavaScript scrollTo method does nothing?

window.scrollto not working react
javascript scroll to bottom
vanilla js scroll to element
javascript scroll to bottom of div
javascript scroll to top of div
window.scrollto not working vue
javascript scroll to top of page
window.scrollto id

So I am desperatley trying to get some scrolling functionality to work on a page. After not having a luck I decide to just stick window.scrollTo(0, 800); on my page to see if I could get any scrolling to happen. Nothing does happen. I have an accordion that expands and then I want to scroll to a specific element with in it. But for now I would be happy to just see the thing scroll at all. Anyone run into this?

Thanks!


If you have something like this:

html, body { height: 100%; overflow:auto; }

If both body and html have a height definition of 100% and also scrolling enabled, window.scrollTo (and all derived scrolling mechanisms) do not work, despite a scrollbar being displayed (which can be used by the user), when the contents exceed that 100% body height. This is because the scrollbar you see is not that of the window, but that of the body.

Solution:

html { height: 100%; overflow:auto; }
body { height: 100%; }

Window.scrollTo(), Window.scrollTo() scrolls to a particular set of coordinates in the document. Window.scroll() is effectively the same as this method. For relative  window.scrollTo(0,document.body.scrollHeight); Whereas all it does is logs "undefined" in the console. Inputting. document.body.scrollHeight returns an integer 736. Other than that, it doesn't matter what I input into the function's parameters, nothing happens. What more, it only happens on one website.


I fixed this problem with using a setTimout. I was using angularjs but maybe it can help in vanilla js too.

        setTimeout(function () {
            window.scrollTo(0, 300);
        },2);

Element.scrollTo(), The scrollTo() method of the Element interface scrolls to a particular set of coordinates inside a given element. The scrollTo() method of the Element interface scrolls to a particular set of coordinates inside a given element. Syntax element.scrollTo(x-coord, y-coord) element.scrollTo(options) Parameters. x-coord is the pixel along the horizontal axis of the element that you want displayed in the upper left.


I was able to resolve this problem using jQuery method animate(). Here is an example of the implementation I went with:

$('#content').animate({ scrollTop: elementOffset }, 200);

The selector is getting the div with ID = "content". I am then applying the animate method on it with scrollTop as an option. The second parameter is the time in milliseconds for the animation duration. I hope this helps someone else.

Window scrollTo() Method, Well organized and easy to understand Web building tutorials with lots of examples of how to use HTML, CSS, JavaScript, SQL, PHP, Python, Bootstrap, Java  I have a NestedScrollView being used with CoordinatorLayout + AppBarLayout + CollapsingToolbarLayout with parallax effect similar to this tutorial. I need to scroll the content programmatically (preferably a smooth scroll, i.e. animated), however calling the scroll methods (scrollBy(), scrollTo(), smoothScrollTo(), smoothScrollBy()) do nothing.


Sometimes its not just the css issue, For me it browser was the culprit. I had to solve it by this code.

 if ('scrollRestoration' in window.history) {
  window.history.scrollRestoration = 'manual'
}

It lets developer take the ownership of scroll changes. Read more about it here

scrollTo feature not working anymore, notifications not visible etc , scrollTo feature not working anymore, notifications not visible etc #12625. Closed​. tsteur opened There is a native Javascript method for this:  One way to polyfill this method is to run the scroll method in a requestAnimationFrame powered loop. Nothing too fancy here. Nothing too fancy here. The main problem that arises is how to detect when this variant is not supported. actually @nlawson's answer tackles this problem perfectly


I was having this same problem today and then I discovered that when I took out the auto generated doctype block:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

The window.scrollTo(0,800) started working along with the ExtJs scrollTo() function I was originally trying to use. I put the block back in and it stopped working. I don't know if this is what you were running into (2 years ago) but hopefully this helps someone else running into the same problem.

Javascript, The Window scrollTo() method is used to scroll to a particular set of coordinates in the document. Syntax: window.scrollTo(x-coord, y-coord). Parameters: The  Definition and Usage. The scrollTo() method scrolls the document to the specified coordinates. Tip: Use the scrollBy() method to scroll a specified distance multiple times.


Window sizes and scrolling, How do we find the width and height of the browser window? But on that element, for the whole page, these properties do not work as intended. The method scrollTo(pageX,pageY) scrolls the page to absolute coordinates  Window.scrollTo() scrolls to a particular set of coordinates in the document. Syntax window.scrollTo(x-coord, y-coord) window.scrollTo(options) Parameters. x-coord is the pixel along the horizontal axis of the document that you want displayed in the upper left.


.scrollTop(), This method does not accept any arguments. The vertical scroll position is the same as the number of pixels that are hidden from view above the scrollable area​. The scrollIntoView() method scrolls the specified element into the visible area of the browser window. Browser Support The numbers in the table specifies the first browser version that fully supports the method.


scrollTo method (window) JavaScript, Scrolls the contents of the document window to the specified horizontal and vertical positions. The scrollTo method is a new version of the scroll method and identical to it. If you want to scroll the What does it mean? If the browser is not at the  A ScrollToOptions dictionary can be provided as a parameter for the following methods: Window.scroll() Window.scrollBy() Window.scrollTo() Element.scroll() Element.scrollBy() Element.scrollTo() Properties ScrollToOptions.top Specifies the number of pixels along the Y axis to scroll the window or element. ScrollToOptions.left