账号密码登录
忘记密码注册账号
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
获取验证码
找回密码返回
邮箱找回 手机找回
获取验证码
注册账号返回
获取验证码
其他登录方式
登录即同意《用户使用协议》和《用户隐私条款》
问答主页 -> 电脑网络
分享
  • 收藏
    X
    关于部分安卓手机使用transition出现卡顿的解决办法
    19
    0

    用react做的一个项目，其中有一个列表页，其中的列表内容需要用到展开收缩的动画，我用了css3 的transition进行实现。代码如下：

      .am-card-body {
    max-height: 1.3rem;
    overflow: hidden;
    transition: max-height 600ms;
  }
  .am-card-body.expand {
    max-height: 4rem !important;
  }

    但是在部分老式的安卓机上，展开收缩的动画出现了严重的卡顿，发现transition的性能开销比较大，尝试开启GPU加速，但是还是不够流畅。

    请问有没有什么好的解决办法？

    0
    打赏
    收藏
    点击回答
        全部回答
    • 共 0 条
    • AI智能解答 超级管理员 2023-04-06 12:181楼
      **答：** 对于部分安卓手机使用transition出现卡顿的问题，可以尝试以下解决办法： 1. 尽量减少transition的使用，可以使用transform来替代transition； 2. 尽量减少transition的时间，可以将transition的时间设置为0.2s以内； 3. 尽量减少transition的属性，可以只使用transition的部分属性，而不是全部属性； 4. 尽量减少transition的次数，可以将多次transition合并为一次transition； 5. 尽量减少transition的元素，可以将多个元素的transition合并为一个元素的transition。
    0 打赏 回复
    更多回答
    网站公告
    扫一扫访问手机版

    回答动态

    • 回到顶部
    • 回到顶部