Efeito para Carregar uma imagem
Prezados colegas,
Boa tarde!
Estou desenvolvendo um site de anúncio em php.
Sou inexperiente na área e solicito por favor a ajuda de vcs.
A questão é a seguinte:
Possuo um "quadrado" de 700x450, o qual redimensiono as fotos para este tamanho e abaixo dele ficam as miniaturas dessas imagens.
Por exemplo:
____________________________________
XXXXXX| |XXXXX
XXXXXX| XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX |XXXXX
XXXXXX| XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX |XXXXX
XXXXXX| XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX |XXXXX
XXXXXX| XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX |XXXXX
XXXXXX| XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX |XXXXX
XXXXXX| XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX |XXXXX
XXXXXX| XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX |XXXXX
XXXXXX| XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX |XXXXX
XXXXXX|____________________________________|XXXXX
MINIATURA MINIATURA MINIATURA MINIATURA
MINIATURA MINIATURA MINIATURA MINIATURA
Acontece que as fotos são um pouco pesadas, então quando você clica na miniatura, demora um certo tempo até exibir no "quadrado maior".
Para quem não conhece parece que o site "trava", ou que a pessoa clicou na miniatura e o site não responde, enfim, pelo tempo que demora (meidano dependendo da internet da pessoa), parece que nada acontece.
Gostaria de aplicar o seguinte:
Quando a pessoa clica na miniatura, centralizado no "quadrado maior", apareceria um efeito indicando que a foto está carregando. Por exemplo, quando clicamos em algo no windows que fica com a bolinha girando - exemplificação idiota, não?
Depois que carregasse, abrisse a foto com um efeito sutil - sei lá, uma transição de transparência ficando opaca.
Deu para entender??
Obrigado à todos!
Boa noite.
Discussão (6)
Carregando comentários...