我做了this网页。有3个部分#sidebar
,#postbar
和#content
,它们具有各自的滚动条。我想添加一个动画,让用户知道他们已经到达了本节的结尾。
我可能使用错误的关键字进行搜索,但是大多数信息要么是关于动画滚动的事情,要么是使用诸如AOS或jQuery解决方案之类的库跳到顶部或底部。是否有任何原生方法可以仅使用javascript或简单的CSS库添加此类动画?
最佳答案
您应该尝试Intersection Observer :)现在已经很好地支持了。
const mySections = document.querySelectorAll('.section');
observer = new IntersectionObserver(entries => {
entries.forEach(entry => {
if (entry.intersectionRatio > 0) {
console.log('in the view');
} else {
console.log('out of view. FIRE EVENT!');
}
});
});
mySections.forEach(image => {
observer.observe(image);
});
关于javascript - 在滚动部分的末尾添加动画,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/58646170/