Link to an element on the same page and have it centered in window

StackOverflow https://stackoverflow.com/questions/22415423

Domanda

I am working on a page and it is a little lengthy, so I chose to link to sections of it using the method below:

<a href="#myID">Link</a>

<div id="myID">Content that I would like in center of screen, rather than at the absolute top.</div>

Everything works correctly, as I am pretty proficient with basic stuff like this, but I am wondering if there is a way to make it so that the content I am linking to is a little farther from the top of the browser window, rather than immediately at the top. It doesn't have to be perfectly centered, maybe a margin of 100px or so would be fine.

Thanks

È stato utile?

Soluzione 

<head>
<script>

function change()
{
document.getElementById("myID").style.marginTop="100px";
}
</script>
</head>
<body>
<a href="#myID" onclick="change()">Link</a>

<div id="myID">Content that I would like in center of screen, rather than at the absolute top.sss
<pre>
s
s
s
s
s
s</pre>
</div>
</body>

Altri suggerimenti

All you need to do is add a little CSS:

#myID {
   margin-top: 100px;
}

Hope that helps!

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top