问题标签 [css-animations]

我正在尝试使用 CSS3 动画来放大 div。但是，我想将 div 的顶部保持在它所在的位置。所以我只希望 div 的底部放大。我该怎么做呢？

自从看到Treahouse 网站和树上摇摆的标志效果后，我一直在尝试重现它。

但它不会摆动。

这是关于 JS Fiddle 的演示。

我也尝试了修改。

但这也行不通。请参阅JS Fiddle 上的演示。

我目前正在与 Safari 上的一个非常令人沮丧的错误作斗争，我不知道还能去哪里。

似乎大多数将触发事件的元素（但不是全部，我无法辨别差异因素）focus会导致页面上所有被转换或动画的元素跳到顶部和左侧约 2px。这只发生在页面加载后的第一个焦点事件上。

看到这个 bug 有点烦人，因为它在droplr.com的登录部分中，而且我完全无法在 JSFiddle 上提炼出一个更简单的案例。

如果您有/创建一个帐户并登录，请单击此编辑图标进行下拉：

你会在页面的第一个焦点上看到，抖动。这是页面上有一个单一的拖放并且我触发对违规元素的关注时的时间线：

随着更多的滴，它只是更多的相同，但它似乎最多大约 40 油漆。探查器并没有提出任何邪恶的建议。只是一次浏览 jQuery 内部结构。

translate3d如果不是通过or来布置元素matix3d，我只是使用topand left，这个错误就消失了。经过数小时的调试，我完全不知所措。

希望有人看到类似的东西，可以看看，或者可以给我关于调试下一步的建议。

非常感谢！

更新： Dave Desandro建议是 3d 加速开始了，所以我用 atranslate代替了它，果然，这并没有引起抖动。我不知道为什么硬件加速会随着一个focus事件而启动，而且只有一次。

我已经尝试在页面加载时将 transformZ 设置为 0 以继续并提升硬件，但也没有运气。欢迎任何更多的想法。

我知道css动画有-webkit-animation的简写：

我们可以使用动画代码的简写：

但似乎 -moz-animation 在我的实验中不起作用。真的吗？

好的，所以我正在制作一个动画菜单，可以来回滑动/扩展选项卡，并且看起来很流畅。除了解除绑定到单击选项卡的动画结束事件之外，我已经完成了所有工作。所以几乎你单击一个选项卡，在动画结束时附加一个侦听器，在单击下一个选项卡时，我想将侦听器取消绑定到先前单击的选项卡。但是，由于某种原因，我无法启动 .off 函数。这是我下面的代码

关于为什么关闭事件没有触发的任何想法？

===更新===

如果我the style="display: none;从模板中删除并按照下面的建议应用以下方法，则当您单击任何其他列表项时会触发空容器。还有什么可以做的？

我有一个在运行时使用 jQuery 和 JSON 动态创建的 ul 列表（使用内联 HTML 是一个模板）。当用户单击列表项 (#navItem) 时，我需要更改背景 CSS 样式。我已经尝试了从内联类到 .appentTo() 等我能想到的一切。我下面的内容适用于硬编码元素，但似乎没有任何东西适用于动态加载的内容。更令人困惑的是 li 标签内的元素中的类启动...？？？

任何帮助，将不胜感激。下面是我的代码片段。谢谢。

HTML：

这是将数据作为列表注入 DOM 的函数：

当用户点击一个项目时需要发生的 CSS（仅在该项目上）：

赋予 li 项目的类属性：

我正在创建一个链接列表，其中一个链接容器在悬停时会展开（带有详细信息、图像和描述）。我可以使用 css 过渡或动画对其进行动画处理。

问题是我希望它即使在鼠标移开后也能保持扩展。而且我想在没有javascript的情况下做到这一点。

那可能吗？谢谢！

所以我正在尝试淡化 3 张图像，其中一张慢慢叠放在一起，这样您就可以在几秒钟内看到每张图像，然后再下一张淡入淡出。我在这里学习本教程。但是由于某种原因，我的图像似乎彼此褪色太快，我无法很好地控制时间。

这是我的预览页面。你应该看到一只鸟，然后是西红柿，然后是一艘船，但现在它只是相互重叠并最终落在船上。

我正在关注 Demo 1 和 Demo 3，任何想法为什么我的动画关闭了？提前致谢！:)

我的 jsfiddle：http: //jsfiddle.net/leongaban/TPjWG/

代码：

我有两个背景：

如何nemo.png background从左右无限移动但不影响ocean.png background？

编辑：当他到达最右边（并且图像不再可见）时，他将再次从左边出现并开始从左到右漂移。

我正在使用 CSS3 创建 CSS 动画。我正在使用 rotateX 旋转图像。我想以某种方式标记原点的位置，以便我可以准确地看到旋转点的位置。

如何标记 -webkit-transform-origin 的位置？我对任何解决方案、CSS 或 JavaScript 持开放态度。