如果元素位于经过变换的 div 中而不是经典的 body 滚动区域中,则 AOS 将不会检测到这些元素

我试图使用AOS之外与 [Locotive Scroll] (https://GitHub.com/locomotivemtl/locomotive-scroll). 看起来AOS脚本并没有在取景口中检测到元素,因为它们都位于被转换的地道中. (Locomotive Scroll 平滑卷轴行为)

□此为:

• 虫头

□ 规格

• AOS版本: 2.3.2
• OS: 视窗
• 浏览器:Chrome

□ 预期行为 具有数据-aos属性的元素在进入取景口时应当被动画化.

□ 实际行为 AOS在取景口没有检测到元素.

□ 重现问题的步骤

1. 搭建带有机车滚动容器的基本站点
2. 创建 100vh div
3. 创建第二个带有AOS动画的Div

□ 详细描述 我并没有对AOS脚本代码进行太多的挖掘,但我怀疑你使用元素相抵消的位置来计算进入取景口时的位置.

□ 可能的解决方案 我现在没有办法,但我有一个丑陋的修补。 在我的项目中,我不再包括 AOS JavaScript 并且只使用这个:

`让观察员=新的交叉观察员(参会者、观察员){{ 条目。 每条( 条目 {{{{}) if( entry.is intersecting) { 条目. target.classList.add ('aos-animate') ; {\fn黑体\fs22\bord1\shad0\3aHBE\4aH00\fscx67\fscy66\2cHFFFFFF\3cH808080}当然 a. 输入. target.classList.remove('aos-animate'); {\fn黑体\fs22\bord1\shad0\3aHBE\4aH00\fscx67\fscy66\2cHFFFFFF\3cH808080}你觉得呢?

• ;
• ; 文档.querySelectorAll('[data-aos]'). for Each(aosElem { 观察者.observe (aosElem)}) ; ; ; ; ;

现在播放动画. 我认为使用我的剧本会打破很多AOS属性功能,但这是我至今为止找到的唯一方法使它在我的案件中奏效.