ios8下css3动画transition:translateY()无法正常使用
发布于 5 年前 作者 yongdeng 5151 次浏览 来自 问答

这次上线的版本中增加了部分css3的动画, 其中有一个站点选择的动画是使用的transition: translateY();属性写的, 上线后有用户反馈页面被底部的页面直接遮盖掉了, 详见代码片段wechatide://minicode/ACVrnams7inF, 用户反馈ios版本为ios8.4.1

2 回复

你好，麻烦截图一下问题的表现，好做判断

页面进入的时候的样式是这样的, 点击请选择到达站点后, 之前定位在最底部的一层会动画到上面来覆盖页面, 通过 修改 transition: translateY(-100%); 为transition: translateY(0%); 实现这样的弹层动画

点击请选择到达站点后, 会变成这个样子(在最底部的一层会显示出来)

但是客服收到用户返回, 页面进入的时候就是图二的样子, 所以我们初步判断是因为css3的transition样式, 在ios8下无效造成的

补充一个gif描述

回到顶部