Paulo Dos Santos Paulo Dos Santos - 1 year ago 69
CSS Question

Problems with ID anchors

I'm trying to use reload a page to go to an anchor, but the page don't reload or scroll to the anchor. The anchor is not shown till the link is hit.

$('.link').click(function() {
$('#box').css('display', 'block');

#box {
display: none;

<script src=""></script>
<div id="box">
<p>Description of the content.</p>
<a href="#box" class="link">Go to #Box</a>

This is the page in my blog:

For exemple:

  1. I open
    in a small window (width of 500px, the content is shown).

  2. I click in Menu (the content is hidden, the menu is shown).

  3. I click in a link

  4. The page does nothing (it doesn't reload)!!!

What I want is to go to the page
on itself.

PS.: It only works when the link is opened in a new window/tab.

It should be opened in a small screen because the problem is happening there (responsive page). Thanks!

Answer Source

If the anchor is display:none, it may as well not exist for the purpose of navigation. Try this styling instead:

#box {


#box {
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download