I'm having a problem with my website, at the top of my page i made a list/menu with links, when you press the link the page jumps down to the topic you want, but the problem is when you press the link it crops off the top of the page, so you can't see the top 200px. How do I fix this? And why does it do that in the first place? I can see when you press the link the URL changes to "/#jump1" at the end.
This is the HTML:
<ul id="js-menu"> <li class="portfolio-menu" id="menu-li-1"><a href="#jump-2">Tema 2</a></li> <li class="portfolio-menu" id="menu-li-2"><a href="#jump-3">Tema 3</a></li> <li class="portfolio-menu" id="menu-li-3"><a href="#jump-4">Tema 4</a></li> <li class="portfolio-menu" id="menu-li-4"><a href="#jump-5">Tema 5</a></li> <li class="portfolio-menu" id="menu-li-5"><a href="#jump-6">Tema 6</a></li> </ul>
and this is how the #jump is applied:
<h2 id="jump-3">Tema 3</h2>
I tried searching on the web to find answers, but i have not found it... Please help.
Just take the time and find the solution yourself. There are countless options from CSS to JS, but here are some that you can give a try.
Easiest solution:
Another solution, taken from here, @LGT:
Another solution: