背景の透明度を持つスクロールブロックの背後にあるIE9 "テアリング"背景画像

Question

背景画像を持つ親ブロック上に透明な背景を持つ静的な自動スクロールブロックを使用するデザインを作成しました。 IE9では、スクロールすると、他のAレベルブラウザのように固定されているのではなく、親の背景イメージが「裂ける」ようになります。この問題はおなじみですか？

これを正しく説明していない場合は、see an example on the live siteです。この例では、レイアウト内に1つの垂直スクロールバーが表示されます。このバーをスクロールすると、IE9の「引き裂き」が発生します。 （注：jQuery Colorプラグインを使用していますが、問題が発生する可能性があります。また、zオーダーや絶対/相対CSSの配置が必要な場合もあります）。

Answer 1

デベロッパーツールで#PresentationFlowからrgba（0,102,51,0.5）のバックグラウンドカラーのインラインスタイルを削除すると、問題が解消されました。

これはカラープラグインなのでしょうか？

更新：代わりに#PresentationOverflowContainerに透明な背景を追加する方法があります。いくつかのパディングを削除する必要がありますが、それを見てください。

Answer 2

divに#PresentationFlowをラップし、そのdivに背景色を入れてみます。

<div id="wrapper" style="background-color: rgba(0, 102, 51, 0.5)"> 
    <div id="PresentationFlow"> <!-- overflow: auto --> 
    </div> 
</div>