1

古いバージョンの IE で自分の Web サイトに丸みのあるコーナーとドロップ シャドウを持たせるために、pie.htc を使用しています。

問題は、IE の実行が非常に遅いように見えることです。

これが私のコードの例です...これを改善する方法を誰かが見ることができますか?

div.myDiv {
    -webkit-border-radius: 5px;    
    -moz-border-radius: 5px;    
    border-radius: 5px; 
    -webkit-box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, 0.4);
    box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, 0.4);
    behavior: url(/PIE.htc);
}
4

2 に答える 2

2

私はプロジェクトで CSS3Pie をよく使用しました。サイトをまったく同じに見せる必要があったためです。これはもちろん、技術者にとってナンセンスですが、営業担当者にとっては意味がありません。

実際、.htcパイはこれらのルールを解析し、それに応じた VML 要素を作成して、それに応じた css3 動作をエミュレートする必要があるため、どのような種類のファイルを使用しても非常に遅くなります。大規模なプロジェクトがある場合は、次の方法以外に選択肢はありません。

  • IE8 の CSS3 機能を完全に省略 (そしてセールス担当者を説得) <- 私のお気に入りのオプション
  • 可能な限りパイを省略し、IE フィルターを使用する
  • PIE は (サポートが非常に優れているため) 非常に肥大化し、かなり遅いため、サポートは少ないが処理が高速な、より軽量なフレームワークを使用します。

Razor のアドバイスのような位置を使用しても速度の問題は実際には解決されず-ms、接頭辞を使用すると、IE9 で css3pie と接頭辞付きの css3-property の両方を使用しようとすると深刻な問題が発生する可能性があります。

于 2013-01-25T12:00:57.070 に答える
0

変更のためにこれを試してください

div.myDiv 
{
  border-radius: 5px; 
  -ms-border-radius: 5px;
  -webkit-border-radius: 5px;    
  -moz-border-radius: 5px;    
  box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, 0.4);
  -ms-box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, 0.4);      
  -webkit-box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, 0.4);
  -moz-box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, 0.4);
  behavior: url(/PIE.htc);
  position:relative;
}

PIE.htc ファイルは、準備ができたときに DOM とともに非同期に読み込まれます。を設定すると、position:relative確実に優位に立つことができます。-ms-IE の検出に役立つコード スニペットのi プレフィックス。それは私のために働いた。私は最新の PIE.htc ファイルを使用しました。

于 2013-01-25T11:49:45.033 に答える