Why are my anchor links not working


(Georg) #1

I’ve built a site https://dl.dropboxusercontent.com/spa/5j2swunfz1sqhzf/Exports/rookiedesjahres%20phase2/rookiedesjahres%20phase2.html and set some navigation/anchor links in the top area - they have been working in the beginning, but now for some reason they don’t

we have a launch-date tomorrow, so I would really appreciate a fast answer :smile:
thanks!


(Mark Hunte) #2

It is a bit hard to tell without seeing the actual project. And how you have done the anchors but if you have done them by giving an element and id like kandidaten and then having the action open #kandidaten Then I think that you now may not have them.

When I do a test like the above, in the debugger the aria-flowto for the button points to the id of the element with the id.
Yours all point to hype generated ones. Now I am not 100% about this but that may be the problem.

This is the div of my Button that jumps to the Anchor:

<div class="HYPE_element" id="hype-obj-EQq0uLSxgKmhUeVo" role="button" aria-flowto="bottom" style="pointer-events: auto; position: absolute; z-index: 2; border: 1px solid rgb(160, 160, 160); padding: 6px; -webkit-user-select: none; background-color: rgb(240, 240, 240); word-wrap: break-word; display: inline; font-size: 13px; text-align: center; color: rgb(0, 0, 0); cursor: pointer; overflow: visible; width: 90px; height: 15px; top: 59px; left: 260px;">Button</div>

Notice aria-flowto=“bottom”

The element id is named bottom and the anchor is #bottom


(Hans-Gerd Claßen) #3

Du hast innerhalb eines

'<a ..,./> '

einen Namen als Ziel verwendet … das funktioniert nicht.
Gebe dem hypelelement (container) die entsprechende id …
sollte gehen … :slight_smile: Bitte aufpassen: mehrere layouts bedingen andere ids


(Georg) #4

Hi!
danke für deine antwort. aktuell habe ich beim ziel-element: Die Kandidaten hinterlegt - hier müsste ich dann eine id eintragen? oder wie finde ich die ID des elements?

beim link selbst in der “navigation” habe ich "Bei Mausklick > Aktion Zu URL wechseln > #kandidaten hinterlegt - was müsste dann hier rein?

danke für deine hilfe!


(Hans-Gerd Claßen) #5

ich habe dir ein Beispiel angehangen.
mit jquery kannst du auch sehr einfach smooth scrollen … ist auch mit dran.

target.hype.zip (43.3 KB)

here two examples to go to the anchor. one of them uses jquery to scroll smoothly to the anchor, which is a nice effect :slight_smile:


(Mark Hunte) #6

The way I am talking about and the Taste button in Hans’s example is explain here


(Georg) #7

hi guys,

it works now - finally! the error/mistake was, that there has been two identical anchor links in two layouts - so they really have to be unique in order to work.

thanks!!!