Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Starting a page at a certain scroll point

Is there a way (with CSS3, JS, or anything in between) to get a page to start at a certain point scrolled down?

I'd like for my page to load without the header initially displaying on load (meaning it's above the actual viewport of the user).

Is there a simple/easy way to go about this?

like image 736
aroooo Avatar asked Jun 25 '12 05:06

aroooo


People also ask

How do I change the scrolling position in Windows?

If you want to set the scroll position of document. body , you can scroll the entire window altogether using window. scrollTo() ; it takes either a pair of coordinates (x,y) or an options object – if you just want to scroll nicely to the top, try window. scrollTo({top:0,behavior:'smooth'}); .

How do I change the scrolling event?

First, set the scrolling flag to false . If the scroll event fires set the scrolling flag to true inside the scroll event handler. Then, execute the scroll event handler using the setInterval() every 300 milliseconds if the scroll events have been fired.


1 Answers

You can use standard javascript: window.scroll(x, y).

This should work pretty well considering that you'll be doing this at onload, i.e. the window should begin at (0, 0). Play around with (x, y) until you get your header to the position that you're happy with. Naturally you'll need to change it anytime the header moves.

Example:

<body onLoad="window.scroll(0, 150)"> 
like image 71
pb2q Avatar answered Sep 24 '22 06:09

pb2q