jQuery动画链接

我有一个图像，我想开始不可见，然后在某个点上，使其可见，然后有它的不透明度降低到.5在2秒的持续时间。 以下是我希望发生这种情况时使用的代码：

  $("#image").removeClass("notVisible").addClass("visible").animate({
                    opacity: 0.5,
                  }, 2000);

我的问题是，按照代码的原样，图像在不透明度为.5时直接可见，但我想要的是图像变为可见（在正常不透明度为1时），然后才设置动画为不透明度。5 感谢您的时间，

使用

.fadeTo（）

方法设置匹配元素不透明度的动画

持续时间以毫秒为单位；值越高表示动画速度越慢，而不是速度越快。可以提供字符串“fast”和“slow”，分别表示200毫秒和600毫秒的持续时间。如果提供了任何其他字符串，则使用默认的持续时间400毫秒。与其他效果方法不同，.fadeTo（）要求显式指定持续时间

$( "#clickme" ).click(function() {
  $( "#book" ).fadeTo( "slow" , 0.5, function() {
    // Animation complete.
  });
});

资料来源：

就你而言：

$("#image").removeClass("notVisible").addClass("visible").fadeTo( 2000 , 0.5)

并在css中将#图像不透明度设置为1

---

还有一个很好的JsFiddle用于此

我认为您需要将元素的初始显示设置为

none

，首先添加类

visible

，然后删除

notVisible

类，以使其变得明显。因为通过先删除

notVisible

类，将立即显示元素

$（“#图像”）.addClass（“可见”）.removeClass（“不可见”）.animate({
不透明度：0.5，
}, 2000);						

。不可见{
显示：无；
}
.可见{
显示：块；
}

像这样吗

$（文档）.ready（函数（）{
变量y=setInterval（函数（）{
$（#myElem”）.css（'display'，'block'）.fadeTo（2000，0.5）；
净间隔（y）；
},2000);
});
#迈勒姆{
显示：无；
宽度：100px；
高度：100px；
背景：红色；
}