jQuery动画-扩展正确的文本内容？

Question

嗨，我正在尝试制作动画或提供任何幻灯片效果来切换课程（实际的扩展），因为目前这有点简单

这是我目前正在您的帮助下进行的小提琴 ，但是它什么也没做，无法解决。

$(document).ready(function(){
  $(".gamewrapper").click(function(){
    $(".game-name", this).toggleClass("black");
    $(this).toggleClass("expand", 1000);
  });
});

任何帮助，请，

提前致谢

Answer 1

jQuery的.toggleClass()方法仅使用1个参数，您在其中获得的1000参数不执行任何操作。

如果要动画化在具有expand类与不具有expand类之间的css更改，则必须：

1）在这些属性上使用CSS过渡：

http://www.w3schools.com/css3/css3_transitions.asp

2）使用其他插件。 jQueryUI有一个switchClass插件可以做到这一点。

http://jqueryui.com/switchClass/

Answer 2

我同意尼古拉斯，

CSS3 Transitions，jQueryUI或您也可以使用jQuery.animate为所有样式设置动画。

例如

$('.classname').animate({'width':'100px','height':'100px'},200)

Answer 3

jQuery UI toggleClass方法是内置的jQuery方法重写：

jQuery UI覆盖了几种内置jQuery方法，以提供其他功能。 使用这些替代时，确保已加载jQuery UI非常重要。 如果未加载jQuery UI，则这些方法将仍然存在，但是预期的功能将不可用，从而导致可能难以跟踪的错误。

该方法在执行操作时接受一个缓动参数：

缓动（默认值：swing）类型：字符串一个字符串，指示用于过渡的缓动功能。

摆弄的问题是您不包括 jQuery UI库。

工作动画小提琴： http : //jsfiddle.net/YqxAR/53/