anchor link not working ' only on this site ' Very Strange

Hi Guys

can you view this website www.wonkyheart.co.uk/bourne.html and click the parties button it will take you down to a block where you can see the 3 party choices but when you click the link ' party enquiry form ' at the bottom of the party information which is - link bourne.html#enquiry-form - it will not take you anywhere.

Works fine when I ask just for a page link bourne.html and anchor links work in my other sites but not on this one. VERY CONFUSED '

Can you help

Looks like the ID on your index page is missing the # sign in front of the ID.

Hi Jo ' thanks for the reply But the party booking button at the top of the same page as the party enquiry form is using the anchor link ( #form-block ) this is working fine ' but the link on the bourne.html page is using ( index.html/#form-block ) is just dead ' so I think the party enquiry form has the correct id of ( #form-block. )

Sorry to be a pain but is there something I'm not getting here.

hope you can help

I've also checked the full url and the anchor link works ' http://www.wonkyheart.co.uk/index.html#form-block

Okay ' been on this all morning and it's driving me mad ' we'll madder ' The link is no longer a link when I add the anchor # ' in other words when the link is ( index.html ) it's fine. but when I add the anchor link ( #form-block ) this to make ( index.html#form-block ) it dies has anyone got any ideas what I'm doing wrong ' the ID is correct on the index page as the top nav button ( booking form ) uses it

One thing I've noticed is you have a LOT of duplicate ID's in that document, an ID should not occur more than one time in each document.

I don't know if that has anything to do with your problem but it's certainly not helping you any.

Hi John just cleaned up all of the duplicate ID's so every page has it's very own blocks like woodley-events and such, - link still doesn't work. took the hyphen out ' I read somewhere they can create a problem, so it's now #formblock on the index.html page I'm trying to reach from another page.

http://www.wonkyheart.co.uk/index.html#formblock

Looking at your code on the Parties section where the link to the Form is, the form is not being sent to your index page at all, just to the Formblock which is not on that page so it doesn't know where to go. Unless I'm seeing this in the wrong place? maybe you have duplicate code in there? I didn't scan it that far to see, just to see this:

<p style="text-align: center;margin-bottom: 10px"><a href="#formblock">View our Party Enquiry Form</a></p>

As you can see the link is not set up to go to your form which is on the index page.

HI Jo, Sorry I was messing with code last night and left out the index.html section of the link if you look now the top link has the full (index.html#formblock ) with the anchor on and does not work. I've also added a lower link beneath this that has a link to the index page ( index.html ) that does work

Why is it when I add the anchor to the link it goes dead?

http://www.wonkyheart.co.uk/bourne.html#bourne-parties

Just a suggestion Thomas. Over the years whenever I've had a head banging "this just doesn't make any sense" problem on a web page, I've duplicated the page, then in the duplicate I'll start removing parts of it one by one until the solution to the problem reveals itself.

Usually that left me sitting there with a red face because it turned out to be something so simple and obvious.

Puzzling to be sure, but something with a 2 at the end doesn't exist on your home page either so it's hard to test that with the wrong HREF in the first link.

Hi John yep that's a great idea ' I'll try that Thanks John '

Hi Jo Sorry about that I don't know where that 2 came from ' it's gone now, can check it when you have time ' Thank you Thank you guys for your help

I get a error in the console about "Cannot read property 'top' of undefined" when clicking that link. I think it may be related to not knowing the top of the page position needed for smooth scrolling to the hash location when the new page is loaded. See this link if it helps at all.

https://stackoverflow.com/questions/44899008/how-to-navigate-to-another-page-with-a-smooth-scroll-on-a-specific-id

Twinstream ' Ya did it ' Yipee ' Thanks so much that sorted it ' I haven't got a clue what the guy was talking about on the link but when I copied and pasted the script below into a new javascript file called ' scroll ' it worked ' Thank you so much code below

Thanks to - Twinstream and Tanzeel Osama

Complete code below:

// direct browser to top right away if (window.location.hash) scroll(0,0); // takes care of some browsers issue setTimeout(function(){scroll(0,0);},1);

$(function(){ //your current click function $('.scroll').on('click',function(e){ e.preventDefault(); $('html,body').animate({ scrollTop:$($(this).attr('href')).offset().top + 'px' },1000,'swing'); });

// if we have anchor on the url (calling from other page) if(window.location.hash){ // smooth scroll to the anchor id $('html,body').animate({ scrollTop:$(window.location.hash).offset().top + 'px' },1000,'swing'); } });

Not sure what all that code is about, but if you're still talking about just sending a link from one page to a spot on another page, you don't need to add any code to your pages or externally to do that. It's a built in feature of HTML and if coded correctly works flawlessly without help. I use it all the time and you can see it in use here:

https://pgbmbaptist.org

If you scroll to the bottom of the page there are 4 squares named Serve, Worship, Grow, Give and those all go to different spots of another page. There's no JS or anything needed to make that work.

NOTE: This is not the case if you're working with sending people to different "tabs" on another page, that definitely needs extra code :)

I think the user is trying to accomplish this....

http://vostrel.cz/so/9652944/page.html#anchor_element

Obviously Jo gives the simplest most effective way to acheive this. But if one wants to use smooth scroll on multiple pages and also use smooth scroll when switching between pages, then some script will be involved.

I think the advantage to smooth scroll when switching pages to a hash is that the browser user sees the page change and then scroll down.

Could be Twinstream, but he never asked about that nor provided a link like yours to use as a basis. Either way, he couldn't get it to work at all is my point, and you don't need scripts to "get it to work" at all, only if you want things like the features in your link. :)

Jo - you sound like a javascript bully.My daughter is learning to write javascript and code and I definitely am proud of her accomplishments. Please do not diminish people that want to help....

lol, not at all Twinstream, I'm just pointing out that he didn't ask for that so I wouldn't have known if he wanted something like that. And pointing out that the links don't need JS in order for them to work, only to have them have extra features as you suggested. Trust me, I love JS, I wish I knew how to do it myself! :)

Mainly I wanted to make sure he/you/etc. realized that adding JS was over complicating it "IF" he just wanted it to make the links work. Nothing more nothing less. :P

The little smiley face, the face with the tongue out, the "lol" comment, "overcomplicating"....all childish bullying behaviour from someone who thinks they know it all and how it should be done.