组合范围修正器不适用于数组选择器目标: Tween 在组合中泄露(元素保持可见性:hidden 整个节拍)
问题
在多组合的单文件构建中,被注入的成分-扫描 shim只过滤出string目标. 将一系列选定的字符串交给GSAP, 并按整个文件解决,因此一个组合中的 " set " / " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 " 从 "
根原因
每个成分所注入的包装器(XQhfScopeTimeline " / XQhfScopedGsap" / XQhfRun"):
{\fn黑体\fs22\bord1\shad0\3aHBE\4aH00\fscx67\fscy66\2cHFFFFFF\3cH808080}你来干什么? var hf resolveGsapTarget = 函数(目标) { // 阵列/ 对象绕行范围 返回 hfQueryall(目标);
- ; . . . . . . . . 时间表[方法]=函数(目标){ var args = array. prototype.slic.call(参数); args [0] = hresolveGsapTarget(目标); 返回正本. apply(时间线, 参数);
- ;
QQhfQueryall ' -> QQhfCons' 正确地将字符串选择器剪接到组成根上, 但是一个非字符串会按原样返回, 所以 GSAP 自己的目标分辨率会在全球运行 。 `gsap.utils.toArray (arrayOfSelectors)'有同样的漏洞(代理的' utils.toArray' hook calls the same solder).
* 复制步骤
8. 组合项目(`beat-1'.`beat-8'),每个东道主为Q`<div数据组合-id="beat-N". 在“组合/beat-1.html”中:
{\fn黑体\fs22\bord1\shad0\3aHBE\4aH00\fscx67\fscy66\2cHFFFFFF\3cH808080}你来干什么?
const tl = gsap.timeline({已暂停:真});
tl.set([..bg-grid],".sub"],{自发阿尔法:0},0;然后,在“t” -- no-end” 中,并在已建单行文件中,
{\fn黑体\fs22\bord1\shad0\3aHBE\4aH00\fscx67\fscy66\2cHFFFFFF\3cH808080}你来干什么? gsap.getTweensOf (document.querySelector ('[data-composition-id="beat-7"].sub') [0.. target (). //=> 26(每个元素匹配阵列中的任何选择器,全文档)
26个目标包括`beat-7'自己的`.bg-grid'、`.bg-glow'和所有三个`.sub'要素。 预期:只有`beat-1'的要素。
预期行为
每个元素都解决(并被剪接)一个阵列目标,与等同的逗号分隔字符串选择器完全相同.
实际行为
特温斯泄露 跨越成分界限。
失败模式是不对称和沉默的,这就是它令人讨厌的原因:
- 如果被泄露到的成分还用它自己的正确扫描的字符串来给该元素作动画,那么泄漏是被覆盖的,而且什么也看不见——大多数作者永远不会注意到.
- 如果它不动起来(有文件证明的“CSS = 结束状态,只有JS模式中的不透明性)会鼓励将静态元素单独放出),则被泄露的`autoAlpha:0'棒用于整个时间线,即该元素及其整个子树上的`可视性:隐藏'. 渲染的相框显示一个空白区域,然而,关于后代的`GetComputedStyle ()'仍然报告`Opacity: 1',有界限的矩形未受破坏,`文件FromPoint ()'击中了元素——所以DOM检查说一切都很好。
在我的案例中,`beat-1''的`tl.set([. ".sub".],{自发Alpha:0},0' (at t=0,有`imterender')将三个`.sub'的包装器藏入`beat-7',其中-下层内容就生活在它们下面。 “副帧快照”和输出的“video.mp4”显示整个中下波段为空(链接覆盖)
. . . . . . .内容来源: heygen-com/hyperframes