Question

我很茫然。在这段代码中，＃options应该逐渐消失，但事实并非如此。但是，设置了CSS属性。

$("#content > p").animate({ opacity: '0' }, function() {
    $(this).css("display", "none");
    $("#options").css("opacity", "0").show(0, function() {
        $("#options").fadeIn();
    });
});

Answer 1

opacity仍被设置为0。

您可以将fadeIn()更改为...

$("#options").animate({ opacity: 1}, 500);

jsFiddle

Answer 2

似乎应该可以使用，但显然您需要使用fadeTo()^[docs]方法而不是fadeIn()^[docs]方法。

$('img').css("opacity", 0).show(0,function() {
    $(this).fadeTo(400, 1);
});

虽然show(0,func..在这里看起来有点无意义，但你可以这样做：

$('img').css("opacity", 0).show().fadeTo(400, 1);

...除非您为0持续时间提供的.show()实际上是一个可能引用更大数字的变量。

Answer 3

您可以大量简化代码 - 请记住将opacity设置为0将复制visibility:hidden CSS属性，而fadeOut()将复制display:none CSS属性。这两者之间的一个关键区别是后者将从渲染的DOM中移除元素，因此它不会占用屏幕上的空间，并且周围的节点甚至不知道它在那里。前者将创建一个大空框，其中元素仍然是，但您无法看到它。假设您想使用最常见的后者，这应该有效：

$('#content > p').fadeOut('slow', function() {
    $('#options').fadeIn();
});

回调无法正常工作

3 个答案: