Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Olá pessoal,eu estava tentando descobrir como fazer um Botão Roll Over Roll Out a algum tempo atras, e hoje descobri uma formamelhor do que eu havia encontrado, para aqueles que ainda não sabem vou explicar passo a passo:1.crie um retangulo de qualquer cor.2.tranforme-o em movie clip. (seleciona o retangulo,aperta F8, escolhe 'Movie Clip' em Type, e aperta 'ok');3.dê um duplo clique no retangulo, que agora é um mc(Movie Clip), para edita-lo4.para ficar organizado e facil, renomeie a Layer 1 para fundo.(dê dois cliques na layer e digita fundo e aperta enter)5.adicione uma nova layer e a renomeie para 'texto'.6.nessa layer insira um texto qualquer , por exemplo: home, e posicione ele no centro do retangulo.7.adicione uma nova layer e a renomeie para 'area'. agora copie o frame da layer 'fundo' e cole-o no primeiro frame dalayer 'area'.8.transforme o novo retangulo em um button.(seleciona o retangulo,aperta F8, escolhe 'Button' em Type, e aperta 'ok');9.dê um duplo clique no novo retangulo que é agora um botao. e você entrará no modo de ediçao do botãoonde contém 4 frames.10.selecione o ultimo frame,abaixo de 'hit', e aperta 'F6' para criar um KeyFrame. Agora Seleciona o primeiro framee aperte 'Delete'. dessa forma usaremos apenas a area de clique do botão.11.dê um duplo clique em algum lugar vazio ao redor do retangulo para voltar à tela anterior. se você fez tudo correto,agora você verá um retangulo azul transparente no lugar do ultimo retangulo criado. Torne essa Layer invisível paraficar fácil de trabalhar.(clica no ponto da layer abaixo do olho)12.crie uma nova layer e a denomine para actions. aperte 'f9', e digite 'stop();'13.selecione o frame 12 e aperta F6, e aperte F9 e digite 'stop()' novamente;na layer 'area' selecione o frame 12 e aperta F5na layer 'texto' selecione o frame 12 e aperta F514.na layer 'fundo' selecione o primeiro frame e mude o Tween para 'Shape'agora na mesma layer selecione o frame 12 e aperte F6.Nesse frame, mude a cor do retangulo, ou o tamanho, ou faça quaisquer alterações que desejar.15.agora torne novamente visivel a layer 'area' e selecione o retangulo azul transparente e aperte F9.Aqui é a parte interessante.digite o seguinte código:
on(rollOver){ play();}on(rollOut, releaseOutside){ onEnterFrame = function(){ if(_currentframe != 1){ this.prevFrame(); } if(_currentframe == 1){ delete onEnterFrame; } }}on(release){ getURL("index.htm");}
Prontinho. é a primeira vez que crio um tutorial assim, então se ficou um pouco confuso basta perguntar, podem me mandar emails também.a maneira que eu fazia antes era assim.o codigo acima ficava:
on(rollOver){ gotoAndPlay(2);}on(rollOut, releaseOutside){ gotoAndPlay(13);}on(release){ getURL("index.htm");}
e extendia do frame 12 até o 24 fazendo a animação retornar ao ponto um, deu pra entender? :huh: o problema desse metodo é que se eu passo o mouse em um botão rapidamente e retiro, ele jáirá para o frame 13 o que fica meio estranho. Com esse novo botão , se eu passo o mouse rapido e retiro,a animação retrocede gradativamente. :huh: eu acho que vou encerrar o tutorial por aqui que já meperdi nas palavras.Até a Proxima ^_^
Bem explicado parabens :D
Muito bom o tutorial! ;)
Opa Valeu, antes de vocês falarem achei que tinha ficado confuso, por isso ninguém teria postado nada, mas já que ficou bom vou criar um outro tutorial sobre uma forma mais limpa de fazer um preloader, que eu acho que alguns ainda nao sabem. mas vou tentar postar imagens dessa vez :)
Faz isso mesmo Jair!Acho que todos estão gostando da iniciativa que você esta tomando!Claro que esse do preloader vai ficar melhor que esse não é? ;)falou cara e parabéns pela iniciativa!
muito bom fiz do jeitinhu q você fez e deu certo....eu faço nomeando certo frame como saida e outro frame como entrada, ai coloko no código:on (rollOver){ this.gotoAndPlay("entrada");}on (rollOut) { this.gotoAndPlay("saida");}Mas desse jeito funciono bem legal...valews
opa!da pra fazer um efeito saida e entrada tipo o do AntonioSP ?parece que sim, e nos botoes!! que legal :)
esse tutorial é muito bom, porem ainda tem um pequeno detalhe pra aperfeiçoar a tecnica do rollover rolloutquando na função rollover é inserido o codigo play(); a o seguinte problema, se passares o mouse sobre o botão no momento de volta da transição ele vai parar onde está.pra resolver esse problema temos que detalhar a função rollover do mesmo modo que declaramos a função rollout..exe:..on(rollOver){onEnterFrame = function(){if(_currentframe != 10){this.nextFrame();}if(_currentframe == 10){delete onEnterFrame;}}}onde 10 representa o frame final da animação.o codigo ficará assim.
on(rollOver){onEnterFrame = function(){if(_currentframe != 10){this.nextFrame();}if(_currentframe == 10){delete onEnterFrame;}}}on(rollOut, releaseOutside){onEnterFrame = function(){if(_currentframe != 1){this.prevFrame();}if(_currentframe == 1){delete onEnterFrame;}}}espero que tenha ajudado =)
legal!!funciona mesmo. eu estava usando desse modo em alguns menus que eu fazia,mas de um tempo pra ca nao estava funcionando! acho que eu estava fazendo algumacoisa errada.Muito bom
E ai galera, tudo beleza? Estou fazendo esse tuto e gostei muito, só queria aprender mais uma coisa, como que eu faço pra quando eu clicar (release) ele fazer uma animação, e quando eu clicar, essa animação volta? Faz um tempinho que procuro e não acho. Deem uma força ai :) Obrigado.
Cara eu acho que a maneira mais facil de fazer isso é usando Label! ;)Abraços
valeu cara, salvou o dia
Vixi, fique na mesma, por acaso você conhece algum tuto ou algo relátivo, que aborde o assunto?
Obrigado. http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif
Michell, eu procurei pela net e não achei nada a respeito mas não é dificil de usar!
Vo dar uma resumida!
Label é o nome que você da pra um frame!
Vou fazer um exemplo!
Num frame vazio clique sobre ele e no painel das propriedades vai ter uma pequena caixa de texto escrito "frame name"!
nele você digita qualquer coisa como "abre" (sem aspas), na sua ação coloca!
ACTIONSCRIPT
this.gotoAndPlay("abre");
Quando exportar ele vai começar o video pelo frame "abre", se você colocou o "abre" no frame 15, por exemplo, o filme vai rodar do frame 15 em diante!
É mais ou menos isso cara, qualquer dúvida de um toque ai http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif
Abraços
Lucas Mello
Só tentando entender bem o codigo para poder usar ele e edita-lo futuramente:Tem algumas partes do codigo q n consegui entender a logica.. gostaria se possivel que alguemme explica-se os porques.. se possivel.. Obrigado.Fiz comentarios no codigo numa linguagem bem simples de facil entendimento... só me corrijam se os meus raciocinios estão certo ;p:on(rollOut, releaseOutside){ // quando o mouse sair, qdo clicar fora onEnterFrame = function(){ // dentro da sequencia de frame faça a seguinte função if(_currentframe != 1){ // se o frame atual for diferente de 1 this.prevFrame(); // volte para o frame anterior ( tambem n entendi a logica ) } if(_currentframe == 1){ // se o frame atual for igual a 1 delete onEnterFrame; // aqui eu n entendi a logica.. ?? } }
valew cara muito bom, me salvou...parabéns tbm pra paunugatu que concertou o probleminha....
Olá Murilo,
a lógica é a seguinte:
on(rollOut, releaseOutside){ // quando o mouse sair, ou quando soltar o clique fora.
onEnterFrame = function(){ // dentro da sequencia de frame faça a seguinte função
if(_currentframe != 1){ // se o frame atual for diferente de 1
this.prevFrame(); //se o frame for diferente de um ele vai retrocedendo , até chegar ao frame 1
}
if(_currentframe == 1){ // se o frame atual for igual a 1
delete onEnterFrame; /*deleta a função criada, fazendo todo o processo parar. (pra evitar cargas desnecessárias ao processamento do cliente)*/
}
}Jair,
Seu tutorial é de fato ótimo! Eu coloquei em um site que estou fazendo para minha banda, e funcionou perfeitamente, mas to com um problema...
Estou querendo, com esse botão, chamar um determinado frame, mas não consigo... A dica do label não funciona, pois ele chama um frame de dentro do movieclip..
Tentei assim dentro do botão azul (hit):
on(release){
gotoAndPlay(musicas);
}Tentei dar o "gotoAndplay(_root, musicas)", mas também não funciona.
Instanciei o botão como "musicas_btn", e fiz: "musicas_btn.onrelease..." ele funciona, mas a animação não funciona mais...
O que fazer, camarada? Valeu desde já!
Igor Fediczko
CONSEGUI!!!!!!!!!!!!
estava fazendo besteira.... tinha de usar "_root.gotoAndPlay" em vez de simplesmente "gotoAndPlay"
Até que enfim!
Valeu galera!
pessoal,
eu não costumo entrar muito aqui, as vezes passo muito tempo fora, então se tiverem alguma dúvida, podem me mandar um email que eu respondo.
ainda bem que você resolveu seu problema rápido Igor Fediczko.
Abraços.
Muito bom o tutorial!
Por exemplo. Se eu tenho duas animações diferentes. Uma só ocorre quando passar por cima e a outra quando sair o mouse ela faz OUTRA animação diferente da primeira. Como funcionaria isso nesse código?
Tutorial massa!! Parabéns...
Eu tenho só uma dúvida, por exemplo:
Qdo o mouse está sobre o botão que apareçe a cor de fundo, como eu teria que fazer pra trocar a cor do texto?!
Abraços!
MUITO obrigada, Jair! Eu nao mexo no Flash já tem um bom tempo, esqueci dessas coisas...hj estou aki tentando reaprender e estava pesquisando na net (acho q já tem 1 HORA!) como fazer isso..achei alguns tutoriais por ai mas nao esatav conseguindo, até achar o seu! Parabéns! principalmente por ser um primeiro tutorial..rsrs
q venham outros! :D
sucesso,
abraços.
Olá Pessoal
Depois de um ano voltei ao forum de flash rsrsr.
Voltei para responder a dúvida de um amigo aqui do forum, kjuedf, que me mandou uma MP pedindo para responder algo.
Se alguém tiver alguma dúvida, me mandem uma MP como fez o amigo aí, porquê quando entro no Imasters, às vezes vou direto para outros foruns e nem me lembro de passar por aqui, E se vocês me mandam uma MP eu fico sabendo que alguém precisa de um help, e se eu puder ajudar, eu respondo aqui.
eis a dúvida:
>
estou usando esses botões como menu
e cada pg do site é um movie clip
como chamo essas pgs a partir desse botão?
Eu acho que até tem uma resposta de um amigo aí em cima que poderia responder isso, mas pra ficar mais fácil,
eu respondo aqui. No código de cada botão, existe o seguinte código:
on(release){
getURL("index.htm");
}1.clica com o botão direito do mouse sobre o mc na biblioteca e em linkage.
2.marca a opção export for action script
3.mude o nome do campo identifier para o que você quiser
4.aperte ok.
5.agora digite o seguinte código
on(release){
attachMovie("novainstancia","nomedoidentifier",getHighestNextDepth(),{_x:100,_y:100 /*opcoes do objeto*/});
//assim você chama a instancia para a tela. Se ela precisa ser estartada , então você deve apenas dar um play
novainstancia.play();
// ou qualquer coisa que inicie o movie clip.
}on(release){
this.myMc;
// ou se precisar iniciar,
this.myMc.Play();on(release){
_root.myMc;
//se não estiver no root, digite o caminho:
_root.caminho.myMc
// o caminho é a cadeia completa de objetos onde ele está contido.
// se estiver apenas a um nível acima do botão, faz assim:(embora não seja recomendado):
_parent.this.myMc
}A pergunta do Uriel Juliatti ficou sem resposta: :(
Por exemplo. Se eu tenho duas animações diferentes. Uma só ocorre quando passar por cima e a outra quando sair o mouse ela faz OUTRA animação diferente da primeira. Como funcionaria isso nesse código?
Sei que não adianta mais, porém de qualquer forma, para esse tipo de botão creio que esse código não serviria, já que o efeito do botão roll over e roll out seria retroceder a animação.
Galera, depois de 2 anos de experiência, muitas coisas mudaram, e eu gostaria de compartilhar com vocês algum conhecimento, creio que será útil. Vou tentar arrumar um tempo e criar um tutorial de um botão roll over e roll out mais completo e postar essa semana aqui.
Bom, é isso.
Qualquer coisa me mandem um MP. :P
Estou fazendo um menu no estilo do site da seara: www.seara.com.br
porém como são muitos botões, estou tendo problemas com o rollover, será que alguém sabe como fazer?
Otimo muito bom meu parabens pela iniciativa