Galeria de imagens

350 views

Published on

dfg fgsdfg

Published in: Design
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
350
On SlideShare
0
From Embeds
0
Number of Embeds
4
Actions
Shares
0
Downloads
1
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Galeria de imagens

  1. 1. Galeria de ImagensUtilizando Slices<br />Neste tutorial veremos como fazer uma galeria de imagens. A qual se clica em uma miniatura e esta aparece ampliada em outra área.O layout da galeria será este:Primeiramente, vamos entender o layout e suas funções:<br />Miniaturas<br />Área onde aparecerá as miniaturas ampliadas <br />Vamos começar:1º Passo:Em cada miniatura e no retângulo central, insira um Slice.Botão direito na imagem...Deverá ficar assim:2º Passo:Clique com o botão direito na miniatura e em seguida clique em Add Swap Image Behavior.3º Passo:Na janela que se abre, selecione o Slice (pedaço) de destino (onde apararecerá a miniatura ampliada).No caso, o retângulo central.4º Passo:Selecione Image file e busque a imagem ampliada da miniatura ().Recomendo que você redimensione a imagem ampliada do tamanho da área onde aparecerá, pois se colocar alguma com tamanho inferior, o mecanismo a redimensiona automaticamente e perde qualidade.5º Passo:Desative a opção Restore image onMouseOutApós isso, clique em OK.Repita do 2º ao 5º passo com cada miniatura. Alterando somente no 4º passo a imagem a ampliar.Após feito isso, todos selecionados, deverão ficar assim:6º Passo:Vá até o Menu Window > Behaviors7º Passo:Com a Aba Behaviors aberta, selecione uma miniatura de cada vez e altere Events, de onMouseOver para onClick<br />[ HYPERLINK " http://i37.tinypic.com/14wsnkw.jpg" Ver em tamanho real ]<br />Feito os passos descritos acima, sua galeria estará pronta.Só falta exportá-la para poder usar. <br />8º Passo: Exportando:Vá ao Menu File > ExportTalvez aparece esta mensagem:Pode selecionar Don't show again e clicar em OK. Iremos evitar o que ela avisa no próximo passo.9º Passo:Na janela que se abre, escolha o local a ser salva a sua galeria e defina um nome em Nome do:.Altere Salvar como tipo:, de Images Only para HTML and Images.<br />[ HYPERLINK " http://i36.tinypic.com/15frrcm.jpg" Ver em tamanho real ]<br />E altere também Slices, de None para Export Slices (que é o que aquela mensagem anterior alertava para não esquecer).<br />[ HYPERLINK " http://i36.tinypic.com/2u4hlx1.jpg" Ver em tamanho real ]<br />E clique em Salvar.Exportado! Para conferir sua galeria, é só abrir o arquivo .HTML que foi exportado junto com outro monte de imagens (não alterá-las).<br />Espero que tenham gostado e aproveitem! <br />

×