Candinya / Kratos-Rebirth

一个可爱而现代的 Hexo 主题
GNU General Public License v3.0
630 stars 80 forks source link

优化TOC的Active项的寻找 #117

Closed ArcticLampyrid closed 2 years ago

ArcticLampyrid commented 2 years ago

https://github.com/Candinya/Kratos-Rebirth/blob/9f9e094b2553f374eac11388c91e6f72ab626b8c/src/js/kratosr.js#L601-L617

当前主题使用加载时预计算高度,滚动时匹配的方法,这在响应式布局下相对而言是不可靠的 有可能因为图片未加载完成或窗口大小调整而导致标题位置改变

在传统的实现下,通过scroll事件并始终动态计算高度是一种可靠且常用的方案,至今next主题仍然在使用这种方式 但的确可能造成性能上的不足(还是基本可以忽略的)

在新API下,使用Intersection Observers完成监听是一种较好的方式 可以参考 Building a ‘Table Of Contents’ with active indicator using JavaScript Intersection Observers 但考虑到兼容性问题,可能需要fallback