how to automatically scroll down a html page

Question

I m trying to start each page after the homepage about 500px down  similar to this website  http   unionstationdenver com    You ll notice when viewing pages after the homepage  you re automatically scrolled down without notice but you can than scroll up to revel the featured slider again   I ve played with scrolledHeight but I dont think that is what I need       Basically I have a featured section that is on top of all my content pages  but you shouldn t be able to see this section until you scroll up  Any help

User · Answer

You can use two different techniques to achieve this.

The first one is with javascript: set the scrollTop property of the scrollable element (e.g. document.body.scrollTop = 1000;).

The second is setting the link to point to a specific id in the page e.g.

<a href="mypage.html#sectionOne">section one</a>

Then if in your target page you'll have that ID the page will be scrolled automatically.

User · Answer

Use document scrollTop to change the position of the document  Set the scrollTop of the document equal to the bottom of the featured section of your site

User · Answer

You can use  scrollIntoView   for this  It will bring a specific element into the viewport   Example   document getElementById   bottom    scrollIntoView      Demo  http   jsfiddle net ThinkingStiff DG8yR   Script   function top         document getElementById   top    scrollIntoView            function bottom         document getElementById   bottom    scrollIntoView        window setTimeout  function      top       2000        bottom      HTML    lt div id  top  gt top lt  div gt   lt div id  bottom  gt bottom lt  div gt    CSS    top       border  1px solid black      height  3000px      bottom       border  1px solid red

User · Answer

here is the example using Pure JavaScript   x000D   x000D  function scrollpage       x000D   function f    x000D     x000D    window scrollTo 0 i   x000D    if status  0    x000D        i i 40  x000D     if i gt  Height   status 1     x000D      else   x000D     i i-40  x000D     if i lt  1   status 0        if you don t want continue scroll then remove this line x000D      x000D   setTimeout  f  0 01    x000D    f    x000D    x000D  var Height document documentElement scrollHeight  x000D  var i 1 j Height status 0  x000D  scrollpage    x000D   lt  script gt  x000D   lt style type  text css  gt  x000D   x000D    top   border  1px solid black   height  20000px    x000D    bottom   border  1px solid red    x000D   x000D   lt  style gt  x000D   lt div id  top  gt top lt  div gt  x000D   lt div id  bottom  gt bottom lt  div gt  x000D   x000D   x000D

[javascript] how to automatically scroll down a html page?

Examples related to javascript

Examples related to html

Examples related to css

Examples related to scroll

Examples related to height