您的位置:首页技术文章
文章详情页

css3 - iphone6 plus 微信浏览器下transition动画无效求破

【字号: 日期:2022-06-25 08:50:36浏览:29作者:猪猪

问题描述

iphone6 plus 微信浏览器下transition动画无效但在safari下是ok的,什么原因

opacity: 0; background-color: #378ef1; transform: translateY(100%); -webkit-transform: translateY(100%); transition-property: transform, opacity, -webkit-transform; -webkit-transition-property: transform, opacity, -webkit-transform; transition-duration: 0.4s; -webkit-transition-duration: 0.4s; transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94); -webkit-transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);

active

transform: translateY(0); -webkit-transform: translateY(0); opacity: 1;

问题解答

回答1:

不贴代码,怎么破?

回答2:

css 前缀呢? 写了?

回答3:

微信用的是QQ浏览器的“X5 内核”, 需要添加-webkit-transition才能支持过渡。

回答4:

遇到了相同问题。添加webkit前缀仍然解决不了其他测试机包括iphone 6均可以,我记得的6s plus不行

更新:缓存问题,经验证加前缀可以解决

回答5:

是opacity的问题 去掉就好用了

回答6:

不知道你是不是跟我发生了同样的错误~调用动画的代码请请放在window.onload = function(){}方法内~~

标签: 微信
相关文章: