Animação em Layers

[Douglas 6]

beleza Pessoal,Tem como colocar efeitos em Layers??

[índio 0]

q tipo de efeito???

[Douglas 6]

beleza Indio,Tem que ser um efeito legal e rápido, vai ser para menu.

[índio 0]

Pesquisa sobre Linha de Tempo.

[Douglas 6]

Indio,Não tem, como colocar alguma coisa tipo css, não precisa ser muito sofisticado, um efeito fade por exemplo já seria de grande ajuda.Me responda uma coisa?No Dreamweaver MX, do editor CSS tem no final extensions, não poderia ser por ali??

[lucas_bwd 0]

cara... faz só um css pra quando passar o mouse, mudar a cor... se quer algo mais sofisticado, tipo animações, faz alguma coisa no flash

[Douglas 6]

Lucas,O problema é que eu não manjo em Flash.

[índio 0]

acho q n estou entendendo o tipo de efeito q você quer, seria apenas trocar de cor ou coisa parecida.ps.: pesquisa sobre extensões do drw no imasters, tem um download com 22... la tem uma q você constrói um menu com layers, fica bem legal.

[Douglas 6]

ÍndioPode ser por exemplo, tipo fade, ele vai aparecendo aos poucos.

[lucas_bwd 0]

tem que usar a timeline do dreamweaver[]s

[babu 0]

Salve,

Efeito em fade coloca isso aqui:

 

 

/** <configuração> **/

/** <adaptado por Felipe Macena (babu)> **/

 

 

startColor = "#000000"; // Cor do Link Inicial

endColor = "#FF0000"; // Cor final do Link

 

stepIn = 17; // Tempo do Fade inicial

stepOut = 23; // Tempo do Fade final

 

autoFade = true;

 

sloppyClass = false;

 

/**

**** </configuração>

**************/

 

/*************

**** <instalação>

**

 

Coloque o código abaixo dentro de <heac> e </head>

 

<script src="fade.js" language="Javascript"></script>

 

 

 

Exemplo da utilização:

 

<a href="SUA_PAGINAblah.html" class="fade"><b>click</b></a>

 

 

**

**** </instalação>

**************/

 

hexa = new makearray(16);

for(var i = 0; i < 10; i++)

hexa = i;

hexa[10]="a"; hexa[11]="b"; hexa[12]="c";

hexa[13]="d"; hexa[14]="e"; hexa[15]="f";

 

document.onmouseover = domouseover;

document.onmouseout = domouseout;

 

startColor = dehexize(startColor.toLowerCase());

endColor = dehexize(endColor.toLowerCase());

 

var fadeId = new Array();

 

function dehexize(Color){

var colorArr = new makearray(3);

for (i=1; i<7; i++){

for (j=0; j<16; j++){

if (Color.charAt(i) == hexa[j]){

if (i%2 !=0)

colorArr[Math.floor((i-1)/2)]=eval(j)*16;

else

colorArr[Math.floor((i-1)/2)]+=eval(j);

}

}

}

return colorArr;

}

 

function domouseover() {

if(document.all){

var srcElement = event.srcElement;

if ((srcElement.tagName == "A" && autoFade) || srcElement.className == "fade" || (sloppyClass && srcElement.className.indexOf("fade") != -1))

fade(startColor,endColor,srcElement.uniqueID,stepIn);

}

}

 

function domouseout() {

if (document.all){

var srcElement = event.srcElement;

if ((srcElement.tagName == "A" && autoFade) || srcElement.className == "fade" || (sloppyClass && srcElement.className.indexOf("fade") != -1))

fade(endColor,startColor,srcElement.uniqueID,stepOut);

}

}

 

function makearray(n) {

this.length = n;

for(var i = 1; i <= n; i++)

this = 0;

return this;

}

 

function hex(i) {

if (i < 0)

return "00";

else if (i > 255)

return "ff";

else

return "" + hexa[Math.floor(i/16)] + hexa[i%16];}

 

function setColor(r, g, b, element) {

var hr = hex®; var hg = hex(g); var hb = hex( :ph34r: ;

element.style.color = "#"+hr+hg+hb;

}

 

function fade(s,e, element,step){

var sr = s[0]; var sg = s[1]; var sb = s[2];

var er = e[0]; var eg = e[1]; var eb = e[2];

 

if (fadeId[0] != null && fade[0] != element){

setColor(sr,sg,sb,eval(fadeId[0]));

var i = 1;

while(i < fadeId.length){

clearTimeout(fadeId);

i++;

}

}

 

for(var i = 0; i <= step; i++) {

fadeId[i+1] = setTimeout("setColor(Math.floor(" +sr+ " *(( " +step+ " - " +i+ " )/ " +step+ " ) + " +er+ " * (" +i+ "/" +

step+ ")),Math.floor(" +sg+ " * (( " +step+ " - " +i+ " )/ " +step+ " ) + " +eg+ " * (" +i+ "/" +step+

")),Math.floor(" +sb+ " * ((" +step+ "-" +i+ ")/" +step+ ") + " +eb+ " * (" +i+ "/" +step+ ")),"+element+");",i*step);

}

fadeId[0] = element;

}

[Douglas 6]

Pessoal,Quando eu coloco a linha class="fade" ele coloca o efeito no texto que se encontra dentro da Layer.Como eu faço para colocar nas bordas, tipo a layer vai aparecendo aos poucos. :lol:

[Tiago Prux 0]

Cara.

O Raphael Simas colocou uma coluna sobre isso. Foi lá que eu aprendi. Vê se é ISSO que tu ta procurando.

 

Se for, tu (primeiro vota no meu trabalho, hehehehe), depois, no Dream, tu aperta (CTRL + F9), seleciona a layer que tu quer animar e vai no botãozinho de >, no canto direito e + ADD layer, ou algo parecido para adicionar a camada.

 

Daí ele coloca a layer no animador de 1 à 15, o #1 representa a layer no momento que a página é aberta, o #15 é após a animação.

 

Defina aonde a layer vai estar quando o site abrir em 1 e onde ela vai estar quando a animação acabar em 15.

 

Depois que tu definir isso, tu vai escolher um texto ou figura que vai liberar essa animação. Vai ser nos "comportamentos" que tu irá definir como soltar a animação!

 

E é isso aí cara, qualquer dúvida poste aqui ou entre na coluna de Dreamweaver do Simas que o cara é fera.

 

Tiago Camaratta Prux

Porto Mídia Comunicação

www.portomidia.com.br