1

Isotope を使用していますが、Internet Explorer に問題があります。Chrome/Firefox では、アニメーションは 1 秒以内に完了します。IE 7-9 には 5 秒かかります。

トランジションが使用されており、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 が遅い理由を知っている人はいますか?

言い忘れたことの 1 つ (ちょっと重要) は、次の 2 つのことを行う並べ替えボタンがいくつかあることです。

  1. 一部のアイテムの「タイムスタンプ」を調整します

  2. アイテムを並べ替える

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

IE で遅いのはこのプロセスです。最初のページ読み込みではありません。

4

1 に答える 1

0

Chrome と Firefox は CSS トランジションをサポートし、作業を GPU にオフロードするためです。9までのIEはそうではありません。これは、すべての「トランジション」が Javascript で計算されることを意味します。これは、パフォーマンスがはるかに高くなります。

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

于 2012-12-24T13:09:52.777 に答える