jquery - 我应该如何在 jQuery 函数中使用 CSS 淡出

Question

我有这个 jQuery 函数

 $(document).on('click', "a.delete-just-uploaded-selector", function() {
      $.ajax({
        type: "POST",
        url: url + "/path/",
        data: info,
        success: function(){

        }
    });
       $(this).parents(".deleteimage").animate("fast")
        .animate({ opacity: "hide" }, "slow");          
        return false;
    });

在最后一部分中查看我的淡出动画。我读过，当它是 jQuery 的简单动画时，使用 CSS 转换效果更好(对于手机来说更快更好)。但是我该怎么做呢？在 jQuery 中使用 .css()？我有一个外部样式表。我知道如何在纯 css 中进行 CSS 转换，但不知道如何将它与 jQuery 结合起来。

Answer 1

如果你想用 CSS 做它会像

@keyframes fade {
    from { opacity: 1;}
    to {  opacity: 0; }
}

div.fade {
    opacity: 0;
    animation-name: fade;
    animation-duration: 2s;
}

当你想隐藏一个元素时，你应该只添加类 .fade

$('button').on('click', function() {
    $('.my-div').addClass('fade');
});

参见 fiddle http://jsfiddle.net/shurshilin/cqbj02ob/1/