问题标签 [translate3d]

我怎样才能添加一些代码，以便我translate3d effect也适用于firefox.jquery 代码是：

那么我需要如何以及在哪里添加代码"-**moz**-transform:translate3d(0, '+movepx+'px, 0)"？

谢谢！

我想使用过渡来获得流畅的动画。在附加打开的类的代码中（通过单击链接切换）效果是完美的，但是当我们删除 .opened 时，翻译是即时的。

当我做：

在 HTML 标签上。

Chrome 将所有内容（包括带有位置的主体背景）向下推，但 Firefox 不这样做。

示例： http: //jsfiddle.net/6VTAn/（在 Chrome 和 Firefox 中打开以注意区别）

是否有其他样式/属性可以应用于 HTML 标签，使其表现出与 Chrome 相同的行为。

我正在寻找一种标准方法来将页面向下推送到所有网站和浏览器。

我想为内联 svg 元素的部分设置动画。我认为您可以在 svg 路径元素上使用 css 转换，从而为 svg 的某些部分设置动画，这真的很酷。但是在玩过它之后，我遇到了 translateZ 函数的问题。出于某种原因，在路径元素上使用第三维似乎不起作用？

有人知道为什么吗？它适用于 svg 元素，但不适用于具有类名的路径元素。我在这里做了一个小演示来说明问题：http ://codepen.io/anon/pen/uFEhp

关于这是为什么的任何线索？

我正在用 javascript 和 css 等制作游戏。在某些移动浏览器中，角色的动画速度很慢。现在它正在使用回调。

用户请求瓦片，服务器查看瓦片是否空闲，服务器发送数据包移动头像。

所以用户要走到那个瓷砖，服务器发送瓷砖去哪里。

在功能完成之前，movecallback但我将其删除并使用 CSS3 变换，因为这样更平滑。

看到这个

在CSS上我有这个：

这工作得很好，但不是在游戏中，在游戏中用户将使用此功能转到另一个 div$("tile"+tile).appendChild($("ava_"+id));

所以当您将 div 附加到另一个时，css 转换会被删除？我怎样才能解决这个问题？

如果我对 ImageSurface 应用了 translate ，如何围绕它的原点旋转它？

它不围绕原点旋转。有人可以解释一下是使用“对齐点”作为旋转中心吗？

编辑

我的 ImageSurface 正在旋转，就像它有远距离的旋转点并且它会按比例放大。

我的解决方案

我注意到在具有 css3 属性的元素中使用表单时，Firefox 没有在正确的位置显示表单输入的自动完成建议translate3d。

这是一张表单容器使用以下值的图片：

大图

你可以在这里重现它：http:
//jsfiddle.net/a2X72/2/

（如果它没有自动完成任何内容，请发送一次表单让 Firefox 记录值）

此错误不会发生在其他浏览器中，例如 Chrome、Opera 或 Safari。

我有一个translate3d带有opacity过渡的复合 div（它有）：

如果我opacity在过渡期间更改它，它会在 Safari 中闪烁。
闪烁大约每三秒发生一次，类似于白色闪光。

Chrome中没有这样的问题。

在这个小提琴中上下滚动，看看我的意思。

问题似乎并不局限于不透明度——-webkit-transform在其过渡过程中进行更改具有类似的效果：有时元素会呈现为过渡的最终状态之一。

如果我删除，问题就会消失，-webkit-transform但不幸的是，现在这不是一个选择。
我可以通过其他方式在 Safari 中解决此问题吗？

我正在尝试检测两个元素之间的冲突，并且在使用 css3translate3d而不是使用该top属性时遇到了问题。

问题发生在：

• 铬 (35.0.1916.153 m)
• 歌剧 (22.0.1471.70)

使用translate3d时会延迟检测碰撞。我使用setInterval了 1 毫秒的间隔，以确保几乎实时监控两个元素的位置。

在我的示例中，当检测到碰撞时，小方块将变为黑色。如您所见，有时延迟相当大，有时在动画完成时似乎检测到碰撞。

修改top属性时正常工作：http:
//jsfiddle.net/rHZbt/10/

使用translate3d而不是移动元素时延迟：http:
//jsfiddle.net/rHZbt/9/

这是我检测与 jQuery 冲突的方式：

关于这个错误的原因是什么的任何想法？

在尝试了此处类似帖子的所有答案后，我仍然无法解决我的问题。

当我在带有文本的元素上使用 -webkit-transform: translate3d 时，文本会明显模糊。我已经通过 jsfiddle 复制了下面的问题，但只有在一定宽度时才会出现（尝试调整浏览器大小以查看问题）

http://jsfiddle.net/H4JAM/

另外 - 问题的截图.. http://i.imgur.com/WPYrWpm.png

当给出百分比而不是固定数字时，就会发生这种情况，即 - 50%，而不是 200px。

任何帮助都会很棒！

谢谢