3

そのため、このページの新しいページとcssファイルをajax経由でロードしています。

すべての css ファイルがページに追加された後、ページの不透明度を 1 に設定しましたが、css が適用されずに表示され、1 秒ほど後に css が適用されます。これは恐ろしいように見えますが、どうすれば回避できますか?

CSS が完全にロードされたことを検出する明確な方法が見つかりませんでした。

なぜこのように表示されるのですか？css はまだ完全にダウンロードされていない可能性があると思いますが、前述のとおり、それを回避する方法がわかりません。

4

2 に答える 2

1

私の知る限り、CSSファイルがロードされ、「レイアウト」要素を使用せずにスタイルが適用されたことを確認する防弾の方法はありません。

CSS ファイルの F.ex:

#layout{ height:1px }

次に、JavaScript で (ここでは jQuery を使用します):

var $layout = $('<div>').attr('id', 'layout').appendTo('body');
var check = function() {
    return $layout.height() == 1;
}

if ( !check() ) {
    var tries = 0,
        interval = 10,
        timeout = 5000; // max ms to check for
    setTimeout(function timer() {
        if ( check() ) {
            console.log('CSS loaded');
            $layout.remove();
        } else if (tries*interval >= timeout) {
            console.log('timeout');
        } else {
            tries++;
            setTimeout(timer, interval);
        }
    }, interval);
}
于 2012-10-21T13:53:14.480 に答える
0

これが実装にどのように影響するかは完全にはわかりませんが、次のことができます。

  • ロードされたページのヘッダーにデフォルトの CSS がいくつかあります。これにより、「ちらつき」のあるすべてのコンテンツが完全に非表示になります。
  • 動的に読み込まれた CSS で、このスタイルを「元に戻す」と、すべてが表示されます。

ページが JS なしで動作する必要がある場合は、おそらく、それがどのように影響するかを考慮する必要があります。

于 2012-10-21T14:10:16.097 に答える