Anchor Jumping across the section within page

Question

I am trying to implement "Anchor Jumping" functionality using JavaScript and Angular 2 in my application, Means user can jump across the section within a page.

As per the client requirement, User can jump(Navigate) the section using of pressing Ctrl+Shift+Left/Right Arrow key.

Here, I add one snap to clear out the question as below.

As an example, Suppose first time focus on Menu and user press the Ctrl+Shift+Right Arrow at that time focus should be go to next element item(i.e. Breadcrumb section or any section).

I am very confuse about, How to manage the dynamic loading content? (How can I count this dynamic content in my section?)

Please suggest any idea to achieve this functionality.

Answer 1

What you need is a focus manager. I wouldn't bother writing one from scratch, Angular Focus Manager is one example of how to solve this problem. It also incorporates Mousetrap.js, which adds shortcut directives.

Your dynamic content can always be wrapped in something (even a div) that has its focus managed.

I hope this helps!