Publicado em 28 de jun.

Background estatico e Efeito na Imagem

1° Gostaria de saber como deixar o background img como estático, exemplo enquanto você utiliza o scroll o background não se move apenas as divs.

2° Gostaria também de saber sobre o efeito utilizado nas imagens, parece que no hover teria tipo um zoom, mas acho que isso não é possivel com css neh... gostaria de saber se tem como fazer com css, se for com jquery que tipo de função eu poderia utilizar.

segue o site como exemplo: http://idesigns.com.br/

Discussão (4)

Entre ou cadastre-se para participar da discussão

Entrar Criar conta

L. Henrique· 28 de jun.

Rafael,

Vou tentar explicar da melhor maneira possível...

Para deixar o background estático, é necessário uma propriedade CSS chamada position: fixed;. Todos os elementos que possuírem essa propriedade, seguirão de acordo com o scroll da página.

.exemplo {
 position: fixed;
}

- O hover com zoom é CSS sim, porquê não seria? A diferença é que você não precisa de uma tag <img> (já que ela aumentaria todo seu contexto e quebraria seu container). A ideia é usar <div> com background: url();. Veja um exemplo:

.classe_div {
 background: url('link_da_imagem.jpg') no-repeat center center;
 background-size: 100%;
 /* pra deixar melhor */
 transition: all 0.4s ease;
}
 .classe_div:hover {
 background-size: 150%;
 }

Teste essas propriedades e diga se funcionou.

Abraços!

codercss· 28 de jun.

Olá,

Obrigado pela partilha do site! Tenho uma questão que coloquei aqui: http://forum.imasters.com.br/topic/550434-este-site-utiliza-ajax-js/

Penso que também tem haver com a sua questão.

Bons códigos,

L. Henrique· 28 de jun.

Codercss,

Só peço que deixe as questões como solucionadas, caso realmente tenham sido. Isso ajuda outros visitantes e usuários do fórum a achar respostas pra dúvidas semelhantes.

Verificarei o seu novo post.

Abraços!

codercss· 28 de jun.

>
Codercss,

Só peço que deixe as questões como solucionadas, caso realmente tenham sido. Isso ajuda outros visitantes e usuários do fórum a achar respostas pra dúvidas semelhantes.

Verificarei o seu novo post.

Abraços!

Obrigado pelo aviso, mas ainda as estou a estudar/analisar as respostas! Nos entretanto vou ajudando o pessoal! :P Estou preguiça de programar :P Brincadeira, disso não me canso.... ;)