话不多说,看图:
代码:
// 父盒子
let dad= document.getElementById('dad')
// 子盒子
let son= document.getElementById('son')
// 获取dom距离fu顶部的距离
let offset = son.offsetTop - dad.offsetTop;
dad.scrollTo({top: offset, behavior: 'smooth'})
// 短暂变色
son.classList.add('highlighted');
// 移除类 恢复颜色
setTimeout(function () {
son.classList.remove('highlighted');
}, 600)
.dad {
transition: color .4s ease-in-out;
}
son.highlighted {
color: pink;
}