Question

我正在使用Isotope并且在Internet Explorer中存在问题。在Chrome / Firefox中，动画在一秒钟内完成。 IE 7-9需要五秒钟。

正在使用转换，CSS与http://isotope.metafizzy.co/docs/animating.html#css_transitions

中列出的相同

加载脚本的JS：

$('#timeline').isotope({
    itemSelector : '.item',
    transformsEnabled: true,
    layoutMode: 'spineAlign',
    spineAlign:{
        gutterWidth: 56
    },
    getSortData: {
        timestamp: function($elem){
            return parseFloat($elem.find('.timestamp').text());
        }
    },
    sortBy: 'timestamp',
    sortAscending: false,
    itemPositionDataEnabled: true
});

任何人都知道为什么IE这么慢？

我忘记提及的一件事（有点重要）是我有几个按钮可以做两件事：

调整某些项目的“时间戳”

诉诸物品

$('#timeline').isotope('reloadItems').isotope({sortAscending: false});

这个过程在IE中很慢。不是初始页面加载。

Answer 1

因为Chrome和Firefox支持css转换并将工作卸载到GPU。 IE高达9不。这意味着所有“转换”都是在Javascript中计算的，这在性能上要高得多。

http://caniuse.com/#feat=css-transitions

Internet Explorer中的慢同位素动画

1 个答案: