-2

I'm making a simple one-page website for a school assignment and it has 3 different divs above each other.

My question is how to have the website center the 2nd div of the three when you enter the website, so that you can either scroll up (to see div 1) or down (to see div 3). So, when you load the page the first thing you see is div 2.

Bambi
  • 1
  • 1
    Possible duplicate - http://stackoverflow.com/questions/2835140/how-do-i-link-to-part-of-a-page-hash – Paulie_D Mar 18 '15 at 15:47
  • @Paulie_D This is a little bit different. Bambi isn't linking anyone to the site, like in your article. – michal Mar 18 '15 at 15:48
  • have a look here as suggested by Paulie_D http://stackoverflow.com/questions/2835140/how-do-i-link-to-part-of-a-page-hash – Sim1 Mar 18 '15 at 15:48
  • please provide a sample of the page you've created so we can give you a sample of the solution – Sim1 Mar 18 '15 at 15:50
  • 1
    @Toast Same principle applies....it's called hashing. If the URL has the hash, the page will go there first. – Paulie_D Mar 18 '15 at 15:51

2 Answers2

-1

Here:

Make your landing page auto-redirect to your home page. Replace #yourdivhere with the id of your div.

Landing Page

<head>
    <meta http-equiv="refresh" content="0; url=http://your.site/#yourdivhere" />
</head>


Your Page

<div id="firstdiv">Your content</div>
<div id="yourdivhere">Your div you want to center</div>
<div id="lastdiv">Your content</div>
michal
  • 226
  • 2
  • 11
-1

I found a better way.

This is a very simple script insertion that you can insert in your site.

<body>
<script>
if(window.location.href != "http://your.site/#yourcenterdiv"){
  window.location.href = "http://your.site/#yourcenterdiv";
}
</script>
<div id="yourfirstdiv">CONTENT</div>
<div id="yourcenterdiv">CONTENT HERE</div>
<div id="yourlastdiv">MORE CONTENT</div>
</body>

Please note this only works with http:// urls. It is pretty simple to modify the script to add other urls however, just add something like || "other://example.url/#yourcenterdiv" to the if statement.

michal
  • 226
  • 2
  • 11