2

好的,所以我正在尝试做一些动画。是测试页面。

有相当数量的代码,我认为它们都是相关的,所以在这里粘贴它可能不值得。我可以发布函数定义:

var ImageLoader = function(c,imagelist,oncomplete) {
    var l = 0, imgs = [], i, loaded = 0;
    for( i in imagelist) {
        l++;
        imgs[i] = new Image();
        imgs[i].style.position = "absolute";
        imgs[i].style.left = "100%";
        c.appendChild(imgs[i]);
        imgs[i].onload = function() {
            loaded++;
            if( loaded == l) oncomplete(imgs);
        };
        imgs[i].onerror = function() {
            alert("Failed to load "+this.src);
        };
        imgs[i].src = imagelist[i];
    }
};
var img2bg = function(c,img) {
    var d = document.createElement('div');
    d.style.width = img.width+"px";
    d.style.height = img.height+"px";
    d.style.backgroundImage = "url('"+img.src+"')";
    d.style.position = "absolute";
    d.style.left = "100%";
    c.appendChild(d);
    return d;
};
var Animate = function(callback,time,thenwhat) {
    var start = new Date().getTime();
    var timer = window.setInterval(function() {
        var now = new Date().getTime();
        var pos = Math.min(1,(now-start)/time);
        if( callback) callback(pos);
        if( pos == 1) {
            clearInterval(timer);
            if( thenwhat) thenwhat();
        }
    },25);
};

但是,正如我所提到的,这本身可能不是很有用。

无论如何,直截了当,这个动画在 IE9、IE10、Chrome、Firefox 中都能完美运行……但在 IE8 和 7 中却惨遭失败。

在 的回调函数中ImageLoader,我调用img2bg了两个特定的图像。但是由于某种原因,该函数被调用了两次,其中一张图像被调用了四次或五次,根本没有第二个参数。在整个脚本中实际上没有其他调用img2bg,那么给出了什么?

4

2 回答 2

0

您确定您尝试使用的所有功能都可以在 IE7/8 中使用吗?您使用不透明度。我知道背景位置充其量是错误的。您使用 html5 文档类型,所以我不知道这是否意味着您可能也在使用 html5 元素或 API。这就是让我认为问题所在的原因。

于 2012-12-18T05:15:17.413 回答
0

该问题的“解决方案”是进行特征检测并使动画可选,以便旧浏览器可以跳过它或播放更简单的动画。

于 2012-12-20T04:01:52.817 回答