scrimba
Space Travel Site
The tabs
Keyboard navigation part 2
Go Pro!Bootcamp

Bootcamp

Study group

Collaborate with peers in your dedicated #study-group channel.

Code reviews

Submit projects for review using the /review command in your #code-reviews channel

Keyboard navigation part 2
AboutCommentsNotes
Keyboard navigation part 2
Expand for more info
tabs.js
run
preview
console
const tabList = document.querySelector('[role="tablist"]');
const tabs = tabList.querySelectorAll('[role="tab"]');

let tabFocus = 0;

tabList.addEventListener('keydown', (e) => {
const keydownLeft = 37;
const keydownRight = 39;

// change the tabindex of the current tab to -1


// if the right key is pushed, move to the next tab on the right

// if the left key is pushed, move to the next tab on the left
})
Console
65
,
83
,
68
,
70
,
87
,
57
,
56
,
51
,
75
,
83
,
76
,
65
,
80
,
187
,
88
,
75
,
37
,
39
,
/destination.html
-6:31