使用带有淡入淡出的jQuery .hide()

Question

我有一个.hide()基于复选框隐藏div 的功能.

在这里工作的JS小提琴 真实网站示例在这里

我试图给它动画,以便.hide()淡入/淡出而不是消失.

尝试使用jQuery Fade函数,但作为参数.hide()但似乎不起作用

$("div").click(function () {
      $(this).hide("fade", {}, 1000);
});

我尝试在我的代码中使用它(参见JS Fiddle),如下所示:

if(allSelected.length > 0){
            $("div.prodGrid > div:not(" + allSelected + ")").hide("fade", {}, 1000);
        }

我哪里错了？

Answer 1

$("div").click(function () {
  $(this).fadeOut(1000);
})

还有fadeIn和fadeToggle.

Answer 2

如果你想fadeOut或者,你可以使用@Arnelle的解决方案

替换$(this).hide("fade", {}, 1000); 为

     $(this).hide("slow");//or $(this).hide(1000);

传递"慢"将在隐藏你的div之前给出一个很好的动画.

用变化修改你的小提琴:http://jsfiddle.net/Z9ZVk/8/