问题标签 [css-transforms]

我希望有一种相对简单的方法可以将网页稍微旋转 30 度左右，同时仍然保持其功能齐全且可用。

我完全控制页面，并且可以根据需要对其进行修改以使其更容易。不过，我宁愿不要用 SVG 重写整个东西，但也许 javascript 和 canvas 会起作用？

有没有办法使用 CSS、Javascript 或其他一些跨浏览器方法来实现这一点？

-moz-transform和-moz-transform-origin有什么区别？

可能重复：
iphone webkit css 动画导致闪烁

出于某种原因，就在我的 webkit-transform 属性动画出现之前，有轻微的闪烁。这是我正在做的事情：

CSS：

JavaScript：

就在过渡发生之前，有一个闪烁。知道为什么会这样，我该如何解决这个问题？

谢谢！

更新：这只发生在 Safari 中。尽管动画确实有效，但它不会在 Chrome 中发生。

我想为我的 html 对象设置几个转换选项，但持续时间和延迟不同。

如果我尝试使用类似的东西：

然后我将有不同的时间函数用于变换和不透明度，但我可以为旋转和缩放设置不同的选项，例如旋转 10 秒和缩放 20 秒吗？

我注意到在使用硬件加速优化 iPad 上使用的动画时，我似乎遇到了一个我无法完全解决的问题。如果您正在应用诸如翻译之类的 webkit 转换，尽管动画运行得很好，但如果在动画发生的中间用户滚动页面，当他们释放它会导致动画卡顿，从而恢复到其原始位置并尝试继续它的动画到它的终点。

我一直在到处寻找解决这个问题的方法，在 iPad 商店也看到了它！如果您手头有 iPad 并导航到，例如：http ://webkit.org/demos/transitions-and-transforms/ ，如果您选择一个项目，则在按钮动画完成之前拖动页面（滚动）然后松开它，你会看到动画闪烁回到原来的位置，然后重复直到完成。

我能够解决这个问题的唯一方法是当一个 touchmove 事件发生时，我告诉动画只是停留在它的原始位置，这会阻止它在释放时尝试重复转换，甚至试图告诉它再次去哪里会导致它无论如何都恢复（看到css转换在技术上似乎无法停止）。

有没有人找到任何解决这个问题的方法，我很确定这是 iPad 上的一个错误，而不是动画问题（这不涉及关于 preserve-3d 和你有什么问题），或者我是否应该报告这是一个问题。

谢谢！

我有一个像这样的简单动画：

当我悬停时，它会正确缩放。但就在它即将完成时，它突然弹回原来的大小，然后捕捉到完成的放大版本。

我该如何解决？

有谁知道如何实现这样的倾斜：

使用 CSS 的新转换属性？

如您所见，我正在尝试倾斜两个角，有人知道这是否可能吗？

当我将鼠标悬停在图像上时，我想旋转图像。我使用以下代码进行旋转。但它不起作用....

它对我不起作用。我使用的是 Firefox 4。

有什么方法可以在 IE8 中执行变换和阴影效果。

这是一个快速演示，仅限 Safari。http://jsfiddle.net/2late2die/8AJnD/ 如果去掉透视样式，所有的复选框都会显示正常。Using-webkit-transform-style:preserve-3d做同样的事情（即复选框消失）。似乎也适用于单选框，但不适用于输入元素。

这很可能是 Safari 中的一个错误，但我只是想确认没有解决方案。

我想慢慢放大图像。我的想法在 webkit 中效果很好，但在 Firefox 中却不行。有人知道为什么或如何使它更好吗？