CSS3使用toggleClass进行转换 [英] CSS3 Transitions with toggleClass

问题描述

我在div上设置了 -webkit-transition-duration 属性，其高度由另一个类设置。当我使用jQuery来切换类时，过渡会做一些时髦的事情。

I have the -webkit-transition-duration property set on a div, whose height is set by another class. When I use jQuery to toggle the class, it the transition does something funky.

它一直向上，然后设置到合适的高度而不是仅仅移动从 50px 高度到自动高度，这是我期望它做的。有什么办法解决这个问题？

It goes all the way up, and then is set to the proper height instead of just moving from 50px height to automatic height which is what I expect it to do. What's the fix for this?

这是一个演示： http://jsfiddle.net/XcFxQ/1/

推荐答案

这有效：

http://jsfiddle.net/Eric/XcFxQ/2/

虽然高度不是严格自动的。它手动设置高度以使其具有动画效果。

Although the height is not strictly auto. It manually sets the height in order to make it animate.

这篇关于CSS3使用toggleClass进行转换的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！