jquery - jQuery淡入比淡出更快？

Question

我有一张我想淡入淡出的图像。

$("#img").animate({
    opacity: 0
}, 1000 );


$("#img").animate({
    opacity: 100
}, 1000 );

尽管两者的计时器都设置为 1000 毫秒，但淡入的速度要快得多。为什么会这样？

score 6 · Accepted Answer

对于您的“淡入”动画功能，您将不透明度设置为 100。它应该简单地设置为 1。CSS 中的不透明度是从 0 到 1，因此它在 JavaScript 中是相同的（因为您使用 Javascript 来修改CSS）。

所以这就是发生的事情。jQuery 在 1000 毫秒的过程中将不透明度从 0 设置为 100。但是一旦不透明度达到 1（仅 10 毫秒后），不透明度就已满。

score 2 · Accepted Answer

不透明度在 0 和 1 之间测量，将代码的第二部分更改为：

$("#img").animate({
    opacity: 1
}, 1000 );

它是固定的！

score 2 · Accepted Answer

将不透明度设置为 1 而不是 100。高于 1 的值在 CSS 中有效，但没有任何意义。完全不透明度为 1，不可见表示 0。

score 2 · Accepted Answer

不透明度取值介于 0 和 1 之间，而不是 0 和 100。这会导致最大值 (1) 处于动画淡入淡出的 1%。

score 1 · Accepted Answer

1

它是

$("#img").animate({
    opacity: 1
}, 1000 );

不是100。

于 2012-05-28T11:40:19.977 回答

score 1 · Accepted Answer

或者，您可以使用fadeIn()andfadeOut()方法：

$("#img").fadeOut(1000).fadeIn(1000);

6 回答 6