Anchor link to section in another page not working

I have an anchor link which should take me to a section halfway down the homepage, but I cannot get this to work.
My anchor is
<li class="menu-item"><a href="index.php#about" >ABOUT</a></li>
and the section on the homepage has both an id and a name tag (I have tried both)
<div id="about" name="about" class="col-md-4">
I have also tried setting the anchor link to the full URL but still no joy.
Can anyone advise on what the problem could be?
Thanks in advance.

Hi,

The index page isn’t in current directory, but at the root level, I guess:

<a href="/index.php#about" >

Thank you for your reply, but index.php is in the same directory.

This is the link website

Looks like its a JS problem because if I disable JS the the about link from the portfolio page works fine. With JS enabled the link no longer works.

Probably something to do with this script.


        jQuery("#homepage nav a, .scroll-to").click(function (evn) {

            if (this.href.indexOf('#') != -1) {
                evn.preventDefault();
                jQuery('html,body').scrollTo(this.hash, this.hash);
            }
        });

You are preventing default so nothing happens if something goes wrong I expect but this is not my area. Fix any errors shown in the web console and then try again.

I’ll move to the JS forum so someone more knowledgeable than me can help.:slight_smile:

1 Like

As @PaulOB tested, the url fragment works if I add it in the address bar. So does other links if the page fragment is added. :slightly_smiling_face:

To me the page works without Javascript, all its content seems accessible with Javascript disabled. Except nav links because only the “About” link has the url fragment.

I see that some content sadly depends on Javascript to load, but I can’t see the benefit of Javascript for simple in page navigation.

1 Like

You are spot on. I removed this piece of code and it all works perfectly now. Thank you for your help

1 Like

for reference, this line makes no sense. scrollTo() from its documentation takes 1-3 parameters, the target (which this.hash is), the duration (which is a number), and the settings (which is an object)

Sending it the hash twice would fail to match a parameter pattern.

3 Likes

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.