2013-06-07 2 views
2

Я пытаюсь создать отзывчивый, FIXED фон, который работает во всех основных браузерах.Обложка фона с фиксированным

В основном я после типичного фона: поведение обложки (масштабы с размером браузера) НО, хотите, чтобы фон был зафиксирован для создания эффекта параллакса.

Возможно ли это, если так, как?

CSS-до сих пор без Исправлено:

#front_header { 
background: url(1.png) no-repeat center center; 
-webkit-background-size: cover; 
-moz-background-size: cover; 
-o-background-size: cover; 
background-size: cover; 
} 

#front_header .featured { 
width: 100%; 
max-width: 950px; 
min-width: 755px; 
margin: 0 auto; 
overflow: hidden; 
} 

#front_header .txt { 
margin: 19.5% 0 19.5%; 
text-align:center; 
display: block; 
} 

Тело HTML:

<section id="front_header"> 
<div class="featured"> 
<div class="txt"> 
<h2>Test</h2> 
</div> 
</div> 
</section> 

Как вы можете видеть, при изменении размеров этого фона слегка изменяет. Однако, если я добавлю

background-attached:fixed; 

Фон больше не изменяется, он ведет себя как фиксированный фон.

ответ

0

Попробуйте это:

держать

background-attached:fixed; 

и вместо фона размер: крышка, попробуйте:

background-size: contain; 

Кроме того, для дальнейшего использования, попытайтесь добавить код: http://jsfiddle.net

Лучше всего, когда вы имитируете проблему для всех видеть и помогать.

Смежные вопросы