点击时的css3动画答案

【问题标题】：css3 animation on click点击时的css3动画
【发布时间】：2011-11-08 09:27:38
【问题描述】：

以下 zip 包含网站 html 和所需文件：http://dl.getdropbox.com/u/4281191/login.zip

当您将鼠标悬停在 html (html:hover) 上时，您会看到一个将容器转换为登录框的动画，我希望当我点击“Hello, Guest”菜单中的“Login”时发生这种情况。

无论如何要完成这件事？我是 js 新手...

附加信息：

css 在 html 中，并且 css3 动画被触发：

html:hover id/class {
    property: value;
}

感谢您的帮助！而且我不能在 cmets 投票，因为我没有足够的声誉......但我可以为帮助我的人做一些免费的设计工作^^

【问题讨论】：

我认为当人们需要下载文件时你的机会很糟糕。尝试将其放到网上某处并发布链接，或者更好的是，编辑您的帖子并在此处添加相关代码。
在jsfiddle 上发布您的代码。我没有理由相信你的 zip 不会给我带来病毒。
我冒险了，没有病毒...
人们是否如此害怕病毒以至于他们甚至不信任保管箱链接>.>...在线链接也可能带有病毒，所以这不会改变任何事情。而且这不是 5 行代码，所以在 jsfiddle 上它会太大而且太慢......

【解决方案1】：

我仍然对动画知之甚少，但对于这里重要的事情，您可以使用 .classname:active 或 .classname:focus 选择器之类的东西。但是一旦你点击里面的东西（例如文本框），样式就会消失。

所以，为此，这真的取决于。你只是想要一个包含将用户带到另一个页面的链接的菜单（在这种情况下，你会没事的）还是你想要一个登录表单（在这种情况下，忘记它，使用 jquery）？

为了今天和将来的参考，请保存此链接，因为它将成为您最好的朋友：

更新

是的，我悬停了，但我没有看代码。我现在看了看，不幸的是，答案是否定的。您不能使用 CSS 影响某些上层对象。

为此使用 jQuery。更简单的方法是使用 jQuery 向要更改的元素添加一个类（如 $("#the-object-id").addClass('class-name')）。要保持效果，请添加持续时间参数。阅读有关Adding a class using jQuery 的页面。

【讨论】：