css转换_without_hover？

是否有可能利用CSS转换时，它会不会是合适/可行的触发通过伪选择动画（即:hover，:active等）？

我的用例是我希望在表单提交后进行动画处理。我想我将能够做这样的事情：

.success_message { ...transition stuff + opacity: 0 } 
.success_message.shown { opacity: 1 }

然后使用JavaScript，我将在shown类添加到这个因素我想动画。

为什么不只是使用jQuery或类似的动画？我很高兴你问。 iPhone和其他移动设备上的CSS转换更加顺畅，这是我所针对的平台。目前我正在使用jQuery做动画，但他们不够流畅。

编辑，以澄清我问起关于伪选择器。

来源

2011-07-18 steve

CSS转换与伪类/元素选择器有什么关系？ – BoltClock

你能澄清什么是不可以通过'：hover'或'：active'选择吗？据我所知，你可以在很多元素上使用这些伪选择器。 – pixelfreak

我相信OP是在讨论事件，而不是伪选择器。例如。 “我希望这发生在按钮点击” – ghayes

一切都应该如你所愿。的jsfiddle：http://jsfiddle.net/ghayes/zV9sc/12/

.success_message { 
    opacity: 0.0; 
    transition: opacity 0.3s linear; 
    -webkit-transition: opacity 0.3s linear; 
    -moz-transition: opacity 0.3s linear; 
    -o-transition: opacity 0.3s linear; 
} 

.success_message.shown { 
    opacity: 1.0; 
}

如果这不能解决问题，请包括进一步的代码示例或浏览器的细节。祝你好运！

来源

2011-07-18 23:50:04 ghayes

谢谢！当我第一次尝试这个时，我想我放弃得太快了。感谢JSFiddle上的例子。触感很棒。 – steve

是的，你可以做到这一点。任何时候css属性发生变化时，Css转换都可以工作，即使这是因为类更改了。

来源

2011-07-18 23:44:46

谢谢你的非常快速和准确的答复，我很感激。 – steve

css转换_without_hover？

回答

相关问题