バックグラウンドの添付ファイルのスクロール対固定

Question

私は2000pxの幅の背景の画像を持っています。これは、次のように用意されています。内容が中央に1000px、高解像度モニタでは余白が左右に500px追加されます。

すべての解決策を中心にしたいと思います。

bg {background:url(bg.jpg) no-repeat center top fixed; }とやり取りしてみると、イメージは適切に中央に表示されますが、明らかにスクロールしません。

だから私はscrollでfixedを交換しています： bg {background:url(bg.jpg) no-repeat center top scroll; }が、画像を中心にされていないよりも - 小さい解像度であなたが表示されないはずの左マージンを、見ることができるように、それは左上隅から表示を開始、。

jsfiddle.netの例です。 background-attachmentの値scroll/fixedで再生し、結果ウィンドウのサイズを小さくしようとすると、私が意味することを理解できたらうれしく思います。

この問題を解決するのに手伝ってもらえますか？

Answer 1

は

background-attachment:scroll; 

Answer 2

使用メディアクエリ以下のようなbackground-attachmentプロパティを使用してみてください。このようなもの。

/* Desktops and laptops ----------- */ 
@media only screen 
and (min-width : 1224px) { 

#left-margin-div { 
width:500px; 
height:1700px; /*or whatever your height is*/ 
background-image:url('yourimage.jpg'); 
position:absolute; 
left:-500px; 
} 

/* Large screens ----------- */ 
@media only screen 
and (min-width : 1824px) { 
/* Styles */ 
}