fix(幕布): 放慢字体描边绘制节奏
This commit is contained in:
1 parent
98e053d5cf
commit
48c16835da
1 file changed
+3
-3
@@ -815,15 +815,15 @@ watch(
|
||||
transition 只写在 .is-drawn 里:量完写 --dash 那一次改动不能带过渡,
|
||||
否则偏移会从 0 缓到量好的值(等于提前把字画一遍)。
|
||||
描边节奏为「快-慢」:起笔迅速,随后逐渐放慢收笔。
|
||||
实心延迟 1.7s:系数留了约 15% 余量,五个字都在八成上下(1.6s 前后)收笔,
|
||||
实心延迟 2.6s:系数留了约 15% 余量,五个字都在八成上下(2.5s 前后)收笔,
|
||||
实心压在这个点之后一点点,它们就能一起变实心;太早填会把还没画到的笔画盖住 */
|
||||
.brand-curtain-letter.is-drawn {
|
||||
stroke-opacity: 1;
|
||||
stroke-dashoffset: 0;
|
||||
fill-opacity: 1;
|
||||
transition:
|
||||
stroke-dashoffset 2s cubic-bezier(0.2, 0.9, 0.3, 1),
|
||||
fill-opacity 0.5s ease 1.7s;
|
||||
stroke-dashoffset 3s cubic-bezier(0.2, 0.9, 0.3, 1),
|
||||
fill-opacity 0.6s ease 2.6s;
|
||||
}
|
||||
|
||||
/* 末尾占位:与幕布等高(半屏,svh 避开移动端地址栏收缩导致的跳动),透明 → 露出幕布 */
|
||||
|
||||
Reference in new issue
Block a user