Code:
<a href="#about"> About <abbr title="The Little Taco Shop">About LTS</abbr></a>Display the text "About LTS" when we click on tab key in keyboard.
display text of a link when focused using tab key in JavaScript
Viewed 31
1 Answers
When the tab is focused on the link, the description tag becomes active. The description disappears when the focus is removed.
Did you want this?
document.addEventListener("keydown", (event)=> {
if (event.keyCode === 9) {
document.getElementById("focusBtn").addEventListener('focus', (event) => {
document.getElementById("alt").style.display = "inline-block";
});
document.getElementById("focusBtn").addEventListener('focusout', (event) => {
document.getElementById("alt").style.display = "none";
});
}
});#alt{
display:none;
margin-left:10px;
}<a href="#about" id="focusBtn" > About <abbr id="alt" title="The Little Taco Shop">About LTS</abbr></a>Related