2024 · 第 49 周 · 12.02 — 12.08停在港口是安全的，但亲爱的，那不是造船的目的
-
Did you read the rest of the doc? There are several explanations related to your questions. If it’s unclear, we can makes changes in those sections. x.com
- 读秒 (vue) - ⚠️ 废弃
- CSS#@property, syntax ps: @property 支持的 syntax 类型有个名单[列表]
- CSS#counter-reset 理解为 initial, counter-set, counter-increment, counter() 一般用在
content: counter(counter-name, type?)后面，counters 嵌套，@counter-type 自定义 list-style - CSS#discrete
- CSS#The An+B microsyntax - developer.chrome.com
- CSS#data types
- CSS#values and units: rlh[root line height]
- CSS#length
- CSS#containing-block
- CSS#object-view-box - caniuse
- 纯 CSS 实现未读消息超过 100 自动显示为 99+
- big.js, decimal.js, bignumber
- 动画#Animation - 1) new Animation 2) element.animation(frames, n/* duration */ | KeyframeEffetOptions) 3) element.getAnimations(…) 4) document.getAnimations() - Using the Web Animations API
- 动画#performance.timeOrigin, performance.now(), document.timeline.currentTime, Date.now()
- 动画#AnimationTimeline, DocumentTimeline, ScrollTimeline, ViewTimeline
- CSS numeric factory functions
- 动画#KeyframeEffect 1) new KeyframeEffect(target, keyframes, options?) 2) new KeyframeEffect(sourceKeyframes) - keyframes 使用 Keyframe Formats 结构
- 动画#updateTiming() - 更新动画时长，getTiming(), getComputedTiming()
- 动画# 继承 AnimationEffect, setKeyframes(), getKeyframes()
- 动画#property - [id],ready,finished,startTime,currentTime,playState+pending,playbackRate,replaceState,[effect],[timeline] - persist
- 动画#method - cancel, finish, pause, play, reverse, persist, updatePlaybackRate, commitStyles
- 动画#remove, cancel, finish; element#animationstart,animationcancelanimationendanimationiteration;
- 人生百态
-
你永远不会准备好的，现在就去做吧
- 36kr 列表内容的图片已经在用 Ai 生成，毕竟现在图片和内容的关系本来就不大 ps: 列表效果需要一张单图而已
- 子时[23-01][夜半], 丑时[01-03], 寅时[03-05], 卯时[05-07], 辰时[07, 09][食时][朝食], 巳[sì]时[09-11], 午时[11-13], 未时[13-15], 申时[15-17], 酉时[17-19], 戌时[19-21], 亥时[21-23] - baike.baidu.com
- 动画#CSS Scroll-Snap List Fancy Animation (share) - gsap#ScrollTrigger 0)scroller 默认是 viewport 1) trigger+start/endTrigger+end 确定滚动区间 2) 使用 scrub 把 view-timeline 和 scroll-timeline 绑定到一起 3) pin/pinnedContainer/pinType/pinReparent/pinSpacer/pinSpacing #) markers 用来 debug, 显示 scroller[start,end] #) immediateRender: false 不过还是建议优先使用 timeline 动画 #) toggleActions[play none none none] = [enter leave enterBack leaveBack] example: [play pause resume reset] #) refreshPriority - Navigation links compatibility - Horizontal “containerAnimation” - ScrollTrigger reset issue - fixed with two ScrollTriggers - preventOverlaps and fastScrollEnd ps: css 动画能力离 gsap#ScrollTrigger 动画能力差太远~ - ScrollSmoother