iOS Safari变形歪斜动画故障

时间:2018-08-02 20:55:12

标签: html css mobile-safari

在iOS Safari上使用转换动画转换倾斜属性时,该元素会从屏幕边缘移开,与设置transform-origin属性的位置相反,从而导致“弹跳”效果。以下css属性应用于有问题的元素:

position: fixed;
width: 100%;
transform-origin: 0 0;
transition: transform 1s, opacity .5s cubic-bezier(0.46, 0.03, 0.52, 0.96) 4ms;
-webkit-transition: transform 1s, opacity .5s cubic-bezier(0.46, 0.03, 0.52, 0.96) 4ms;

((我省略了background colorbox-shadowopacity等无关的css属性,以及)

按下按钮时,skewY(30deg)将应用于元素。预期的行为是使元素的边缘与屏幕的边缘保持“接触”。

This就是它的样子。

提前感谢您的帮助!

0 个答案:

没有答案