Ir para o conteúdo
  • Revista PROGRAMAR: Já está disponível a edição #60 da revista programar. Faz já o download aqui!

Daniel Alves

[Resolvido] Como criar Pré visualização de Imagens HTML?

Mensagens Recomendadas

Daniel Alves

Boas Tarde Pessoal

Antes demais peço já desculpa se a pergunta é "parva" mas a verdade é que é algo tão simples que quero fazer e ando aqui às aranhas...

Tenho um site simples com uma galeria de imagens e a única coisa que quero é ao clicar numa das imagens que ela seja pré visualizada ou seja abrir em grande. Se possivel com setas para ir passando de umas para as outras...

Já pesquisei e vi que existem umas ferramentas para esse efeito como o lightbox e o fancybox, só que mesmo seguindo os tutoriais deles não consigo por a funcionar, e quando consigo a imagem amplia mas fica toda desformatada...

Alguem me pode dar uma ajuda?

Muito Obrigado desde já

Partilhar esta mensagem


Ligação para a mensagem
Partilhar noutros sites
KTachyon

Aquilo que queres é uma lightbox como galeria:

http://lokeshdhakar.com/projects/lightbox2/

Vê o "Four image set" que a página tem como exemplo. Depois podes seguir o código no "How to use".

  • Voto 1

“There are two ways of constructing a software design: One way is to make it so simple that there are obviously no deficiencies, and the other way is to make it so complicated that there are no obvious deficiencies. The first method is far more difficult.”

-- Tony Hoare

Partilhar esta mensagem


Ligação para a mensagem
Partilhar noutros sites
Daniel Alves

Sim eu já fiz isso, mas o problema é que as imagens aparecem deformadas... Por exemplo uma imagem horizontal o visualizador encolhe-me a imagem...

Não entendo porquê.

Alguma ideia do que possa ser?!

E muito obrigao pela ajuda KTachyon

Editado por Daniel Alves

Partilhar esta mensagem


Ligação para a mensagem
Partilhar noutros sites
KTachyon

Só vendo. Podem ser problemas de CSS, mas isso deverias ser capaz de apurar abrindo o inspector do teu browser e verificando se tens algum conflito de CSS que possa estar a causar isso.


“There are two ways of constructing a software design: One way is to make it so simple that there are obviously no deficiencies, and the other way is to make it so complicated that there are no obvious deficiencies. The first method is far more difficult.”

-- Tony Hoare

Partilhar esta mensagem


Ligação para a mensagem
Partilhar noutros sites
Daniel Alves

MUITO OBRIGADO por toda a ajuda uma vez mais...

Solucionei o problema com isto: https://css-tricks.com/expanding-images-html5/

E penso que tens razao, eram mesmo conflitos no CSS porque estava a usar um template que já continha muito CSS e com o outro que estava a carregar do lightbox deformava todas as imagens.

Mas pronto consegui resolver de forma simples com este tutorial.

Muito obrigado

Partilhar esta mensagem


Ligação para a mensagem
Partilhar noutros sites

Crie uma conta ou ligue-se para comentar

Só membros podem comentar

Criar nova conta

Registe para ter uma conta na nossa comunidade. É fácil!

Registar nova conta

Entra

Já tem conta? Inicie sessão aqui.

Entrar Agora

×

Aviso Sobre Cookies

Ao usar este site você aceita os nossos Termos de Uso e Política de Privacidade. Este site usa cookies para disponibilizar funcionalidades personalizadas. Para mais informações visite esta página.