Jump to content

Efeito para galeria


AngeloLopes
 Share

Recommended Posts

Boas,

Alguém me consegue ajudar aqui numa parte do meu site ?

Eu estou a criar um site com uma galeria de imagens, e preciso aqui de uma ajuda a criar um efeito nas imagens da mesma.

O efeito que eu queria por no site era ao clicar numa imagem a mesma vai aumentar numa zona isolada, e desfocar todo o fundo.

de forma de exemplo tenho aqui este site que faz como eu queria

http://www.abrancadenevenogelo.com/

Para já não tenho nenhum código feito para os efeitos só mesmo na galeria.

Se alguém me conseguisse dar uma luz para iniciar este efeito, agradecia imenso 😄 :D 😄

Se alguém conhecer um efeito mais bonito para uma galeria, também estou aberto a sugestões.

Cumprimentos,

Ângelo Lopes

Link to comment
Share on other sites

Boas,

Sugiro que uses um "overlay" que fique por cima de tudo e que só mostras quando clicares numa foto.

Atenção que o efeito de "blur" que falas, não é um verdadeiro blur, mas sim um simples overlay com uma cor de background meia transparente (alpha).

O uso de um efeito puro "blur" seria um pouco mais complicado, mas o efieto "overlay" tb acho que funciona.

Avisa se tiveres duvidas.

cumps,

cc

Cumps,

cc

Link to comment
Share on other sites

Boas,

Sugiro que uses um "overlay" que fique por cima de tudo e que só mostras quando clicares numa foto.

Atenção que o efeito de "blur" que falas, não é um verdadeiro blur, mas sim um simples overlay com uma cor de background meia transparente (alpha).

O uso de um efeito puro "blur" seria um pouco mais complicado, mas o efieto "overlay" tb acho que funciona.

Avisa se tiveres duvidas.

cumps,

cc

Como faço isso? :/ Consegues me explicar melhor 😄 Sou muito noobi em js 😄

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...

Important Information

By using this site you accept our Terms of Use and Privacy Policy. We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.