0

私は静的なウェブサイトで作業していますが、何らかの理由で背景画像が原因でサイトのスクロールが非常に遅くなっています。背景画像を削除するとすぐに速度が上がります。

背景に CSS フィルターのぼかし効果を使用したかったのですが、本文の背景画像をぼかしてはいけません。そのため、次のようにしました。

HTML:

<div id="bg">
    <img src="img/iphone.jpg" alt="">
</div>

そしてCSS:

#bg {
 position: fixed; 
 top: -50%; 
 left: -50%; 
 width: 200%; 
 height: 200%;
}

#bg img {
 position: absolute; 
 top: 0; 
 left: 0; 
 right: 0; 
 bottom: 0; 
 opacity:0.6;
 margin: auto; 
 min-width: 50%;
 min-height: 50%;
 filter: blur(3px);
 -webkit-filter: blur(3px);
 -moz-filter: blur(3px);
 -o-filter: blur(3px);
 -ms-filter: blur(3px);
}

必要な背景画像のぼかし効果を得るためにできることはありますが、スクロール速度を損なうことはありませんか?

4

0 に答える 0