1. Trigger an event by clicking
list is
2. Anchor point + timer in the method
1.scrollEl: is the id name added to the element with scroll bar
2. .offsetTop: is the height of the current element (who is the current element) from the top of the browser. js native properties
3. .scrollTop : is the height that the current element scrolls up
3. Code
handleTabClick (item) {
let height = document.getElementById(item.value).offsetTop - 86 // reach the height of the target
let count = document.getElementById('scrollEl').scrollTop // current height from the browser
let timer = setInterval(() => {
document.getElementById('scrollEl').scrollTop = count; // assign the current height from the browser to count
if (height > count) {
count = count+5
if (count >= height) {
clearInterval(timer)
}
} else {
count = count-5
if (count <= height) {
clearInterval(timer)
}
}
}, 1)
},