Yaroslav Saenko
Yaroslav Saenko

Reputation: 587

Anchor links reload the page

I am building a static page in .php file with url http://example.com/support/test and after clicking on this link page is reloaded but does not scroll to the needed section. Here is the example code snippet:

<ul class="links">
    <li>
        <a href="#first">First</a>
    </li>
    <li>
        <a href="#second">Second</a>
    </li>
</ul>

<section>
    <h3 id="first">First</h3>
</section>

<section>
    <h3 id="second">Second</h3>
</section>

But instead of scrolling to the id browser reload the page with a link like that http://example.com/#first. What can be the problem and how can I solve this?

Thanks

Upvotes: 1

Views: 55

Answers (2)

Yaroslav Saenko
Yaroslav Saenko

Reputation: 587

I found the issue. Link href should look like /support/test/#first

Upvotes: 1

PHP Hupp Technologies
PHP Hupp Technologies

Reputation: 1952

Becuase you dont have enough scroll in page, so you are seeing all in one page. You can check with scroll like:

<ul class="links">
    <li>
        <a href="#first">First</a>
    </li>
    <li>
        <a href="#second">Second</a>
    </li>
</ul>

<section>
    <h3 id="first" style="height: 900px;">First</h3>
</section>

<section>
    <h3 id="second" style="height: 900px;">Second</h3>
</section>

Upvotes: 0

Related Questions