-
Notifications
You must be signed in to change notification settings - Fork 3
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
fix: expand animation #111
Conversation
https://developer.mozilla.org/zh-CN/docs/Web/API/Element/clientHeight 这俩height好像确实还有点区别(是否包含border),不过这里为啥需要设置两次height呀 |
clientHeight 等于是你能看到的那部分元素的高度(未展开高度),scrollHeight 是包括看不到的部分元素的高度(展开以后的高度),这里设置两次是为了强制浏览器渲染动画(参考:强制回流) |
可能不太直观?但一直是前端一贯的做法,如果想搞得优雅一点其实可以换成 requestAnimationFrame 函数调用 |
话说这里之前的写法是怎么理解呀,先设置成100%,再设置成scrollHeight |
突然意识到其实上面调用 |
可以理解为先展开,然后再播放动画? |
但是之前的版本在展开的时候,不是没有动画吗😂 |
是...这里先前版本其实是不 work 的,但是代码一直留在这里,所以我才说是一个已知问题( |
bd069d4
to
e058250
Compare
okk 所以目前看起来是把 100% 那句话去掉之后,动画就回来了? |
确实,我目前本地测试是 ok 的(然而我目前不是很清楚它怎么就 work 了) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM
fix #102