Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

PauloAgapito

Background fixed sem imagem

Recommended Posts

Ola pessoal do fórum,

Esse é meu primeiro tópico, pesquisei e não encontrei o que eu precisava, caso eu tenha feito algo de errado me desculpe. Pois bem, estou criando uma página onde tenho algumas divs que ficam fixas dando aquele famoso efeito no background com as imagens sobrepondo as outras.

<div id="container">

<div id="foto1">

<h1> Foto 1 </h1>

</div>

<div id="foto2">

<h1 class="foto2t"> Foto 2 </h1>

<p> Tudo o que você precisa pode contar conosco<br/>

As melhores ofertas você encontra aqui, o melhor preço também<br/>

Quem sabe em um futuro próximo podemos conversar melhor</p>

</div>

<div id="foto3">

<h1> Foto 3 </h1>

</div>

<div id="foto4">

</div>

</div>

Funciona perfeitamente com as imagens, gostaria de saber se é possível fazer o mesmo apenas com o background color, ou seja deixar o fundo branco fixo também, vejam abaixo no #foto2 tentei fazer o que eu quero porém não da certo a divi sobe junto com o conteúdo não ficando fixa, espero que tenha sido claro qualquer duvida pode perguntar um abraço.

#container {

width: 100%;

}

#container h1 {

color: #fff;

text-align: center;

}

#foto1 {

background:url(../_imagens/banner-progressiva.jpg) no-repeat center top fixed;

height: 680px;

}

#foto2 {

background: url(none) 0 0 / 100px 80px no-repeat fixed border-box border-box #g666;

height: 680px;

background-attachment: fixed;

}

#foto3 {

background:url(../_imagens/banner-buckets_1.jpg) no-repeat center top fixed;

height: 680px;

}

#foto4 {

background-color: rgba(4,3,3,0.1);

height:700px;

}

Compartilhar este post


Link para o post
Compartilhar em outros sites

Tenta isso:

#foto2 {
position:fixed
background:#g666;
height: 680px;
}

E aí voce pode controlar a posição a posição da DIV com as propriedades Left e Right ou Margin-left e Margin-right

Compartilhar este post


Link para o post
Compartilhar em outros sites

Fala ai blz, coloquei assim e não deu certo, mas foi um acidente muito agradável, depois que coloquei dessa forma consegui um efeito da barra aparecer com a rolagem do mouse rsrs ficou bem legal daria para resolver com um z-index mas ficou show dessa forma.

Obg amigo.

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.