Question

我跟随this小提琴并创建了我自己的代码，但它实际上是在没有延迟的情况下显示图像。请指导。

<img class="delayImg" style="width:156px;margin: 41px 0; height:37px;opacity:0px;" delayedSrc="logo_new.png"  />

$(document).ready(function() {
    $(".delayImg").each(function() {
        this.onload = function() {
            $(this).animate({opacity: 1}, 4000);
        };
        this.src = this.getAttribute("delayedSrc");
    });
});

Answer 1

添加delay()

 $(this).delay(4000).animate({opacity: 1}, 4000);

我想你可能会对延迟和持续时间感到困惑。动画函数中指定的数字是动画的持续时间，用于添加延迟只需在动画之前添加.delay()。

Fiddle

Answer 2

你在这里有错误：

<img class="delayImg" style="width:156px;margin: 41px 0; height:37px;opacity:0px;" ....

---＆GT; 不透明度：0 没有px

请参阅fiddle css代码，它是：

.delayImg {opacity:0;}

延迟后的Fadein图像

2 个答案:

Fiddle