2011-07-19 4 views
0

サイズ1x700の背景として設定したい画像があります。ページがズームインまたはズームアウトされても、固定の背景イメージサイズを維持するにはどうすればよいですか?

グラデーションソートの画像ですので、repeat-xにする必要があります。

主な問題は、画像がページ全体を満たしていないことです。しかし、それは固定されたままです。特にスクロールアウトすると、画像がページ全体を満たしていないことがわかります。

私のコードはFirefoxとChromeで動作しますが、IE9では動作しません。私はそれが何か違いがあれば、この肌をdotnetnukeにも適用しています。ここで

は私のコードです:そうする原因と、ブラウザのズームや他のブラウザ関連の機能をめちゃくちゃに

body 
{ 
    background-image: url('images/bg.jpg'); 
    background-attachment: fixed; 
    background-repeat: repeat-x; 
    background-size: contain; 
    -moz-background-size: contain; 
} 

答えて

1

WARNING

避けてはexpecially依存しているユーザーのために、ユーザーエクスペリエンスを減らすことができますお気に入りのブラウザのそのような機能に!私は、要素の知っている唯一の方法にかかわらず、ブラウザのズームのサイズをmantainする、と述べた


は、すべての画面を占有するコンテナ要素、およびこのように、割合策を持っている内部の素子を有することです。

http://jsfiddle.net/yLFj8/4/

0

ストリップCSSダウンし、それが動作するはずです。これはあなたが必要とするものでなければなりません。

body { 
    background-image: url('images/bg.jpg'); 
    background-repeat: repeat-x; 
} 

http://jsfiddle.net/jasongennaro/fSG7j/1/

4

ない私が正しく理解していれば必ずここに私の例を参照してください:

をCSSプロパティを使用し、フルスクリーンに画像をフィットするには:

background-size:100% 100%; 

ただし、サイズがcorでなければ画像を伸ばします丁度

関連する問題