Question

$(document).ready(function () {
    $("img#ucar").load(function () {
        $(this)
            .animate({ opacity: 1 / 2 }, 600)
            .animate({ top: "616px" }, 300)
            .animate({ opacity: 1 }, 0);
        return false;
    });
});

.ism {
    top: -400px;
    width: 225px;
    height: 345px;
    margin: 0;
    padding: 0;
    position:absolute;
}

#ucar {
    position: relative;
}

<div class="ism">
    <img id="ucar" src="images/img01.png" />
</div>

此代码正在使用Chrome但不能正常使用IE 11.我只查看了其他问题，我在网站上找不到答案。

Answer 1

这主要发生在脚本有时间执行之前加载的缓存图像（由于缓存）。

添加一项检查以查看图片是否已加载并触发脚本..

$(document).ready(function () {
    $("img#ucar").load(function () {
        $(this)
            .animate({ opacity: 1 / 2 }, 600)
            .animate({ top: "616px" }, 300)
            .animate({ opacity: 1 }, 0);
        return false;
    }).each(function(){
        if (this.complete){
            $(this).trigger('load');
        }
    });
});

http://jsfiddle.net/gaby/k7vz0dgv/

演示

Answer 2

似乎由于某种原因，IE中未触发.load()函数。
你可以通过告诉图像加载一个空字符串""来手动触发事件，这样一旦完成，回调函数就会执行：

$(document).ready(function () {
    // have a look at the load function
    $("img#ucar").load("",function () {
        $(this).animate({
            opacity: 1 / 2            
        }, 600).animate({
            top: "616px"
        }, 300).animate({
            opacity: 1
        }, 0);
        return false;
    });
});

的 Fiddle Example

jQuery Animate或Load函数在IE11中不起作用

2 个答案: