Ok.. iremos agora dar continuidade à coluna anterior que se tratava de animações simples no Image ready. Ela era pré-requisito para esta de agora, que é sobre os rollovers, caso você não tenha visto a coluna de animação veja ela antes de iniciar esta.

o 1º passo é ter o objeto e passar ele para o image ready, assim como mostrado na coluna anterior. tenha seu botão e veja se a janela de animação esta visível.


agora é o que diferencia o rollover da animação. A criação do estado de rollover. na Janela Web content há o botão "create rollover state" que se parece com uma folhina. clicando nela vc criará o estado rollover da sua imagem. é importante clicar neste estado criado para que ele fique selecionado e possa ser feito o seu rollover.


Este ponto é praticamente o mesmo do usado na coluna anterior. Agora que você já criou seu estado de rollover e esta com ele selecionado anime-o da forma que quiser, pode-se ate usar o "fade", animação sequenciada, mas tome cuidado para não exagerar pois isso pode deixar seu botão muito pesado. a opção once, rodar uma vez, e forever, rodar sempre tambem influência no rollover.


Agora você só precisará exportar o seu objeto. Vá em File > save optimized as... lá selecione a op~ção q mais convem a você. É importante deixar sempre a opção save html and images, pois para o rollover funcionar ele precisará do html e das imagens. Na hora de upar para o servidor "upe" a html e a pasta gerada pelo programa, se alterar os nomes pois isso pode gerar erro.


Aqui temos o resultado final (optei por fazer algo simples para não ficar pesado. passe o mouse por cima do botão e vc verá a animação)
o=[]::::>Resultado Rollover<::::[]=o

Não se esqueça que ao trabalhar um layout o image ready trabalhará com cada slice separado, daí a importancia de "fatiar" bem o seu layout. Qualquer duvida comente aqui ou no forum.

Obrigado. Em nossa proxima coluna Mostrarei como utilizar as ferramentas do Photoshop, começando pelas ferramentas de seleção. Até a nossa proxima coluna