Jump to content


Photo

Efeito De Transição De Imagens


  • Faça o login para participar
2 replies to this topic

#1 zóio

zóio

    Turista

  • Usuários
  • 44 posts
  • Sexo:Não informado

Posted 19/09/2006, 09:16

Alguém sabe como fazer um efeito de transição de imagens igual tem na página inicial do UOL?

#2 bimonti

bimonti

    Super Veterano

  • Usuários
  • 2654 posts
  • Sexo:Masculino

Posted 21/09/2006, 07:23

<form name="form_cr" action="" id="painel-conteudo"><textarea name="select_cr" cols="0" rows="0">
Fernando Santos/Folha Imagem|http://home.img.uol.com.br/0609/j/20corinthians.jpg|Corinthians e Vasco ficam no empate em 1 a 1 no Pacaembu|http://click.uol.com.br/?rf=hu-hn-fotos&u=http://esporte.uol.com.br/futebol/ultimas/2006/09/20/ult59u104751.jhtm|
Sérgio Lima/Folha Imagem|http://home.img.uol.com.br/0609/j/20berzoini.jpg|Berzoini deixa a coordenação da campanha de Lula|http://click.uol.com.br/?rf=hu-hn-fotos&u=http://noticias.uol.com.br/ultnot/album/060920_album.jhtm?abrefoto=19|http://home.img.uol.com.br/h0/i_fotob.gif
EFE|http://home.img.uol.com.br/0609/j/20habibi.jpg|"Habibi", peça que estará exposta em igreja de Berlim|http://click.uol.com.br/?rf=hu-hn-fotos&u=http://noticias.uol.com.br/ultnot/album/060920_album.jhtm?abrefoto=27|http://home.img.uol.com.br/h0/i_fotob.gif
L.C. Leite/Folha Imagem|http://home.img.uol.com.br/0609/j/20poli.jpg|Polícia começa Operação Saturação em São Paulo|http://click.uol.com.br/?rf=hu-hn-fotos&u=http://noticias.uol.com.br/ultnot/album/060920_album.jhtm?abrefoto=25|http://home.img.uol.com.br/h0/i_fotob.gif
Divulgação|http://home.img.uol.com.br/0609/j/lenine20.jpg|Lenine canta "Hoje Eu Quero Sair Só" na Rádio UOL|http://click.uol.com.br/?rf=hu-hn-fotos&u=http://radio.musica.uol.com.br/abreradio.htm?canal=318|http://home.img.uol.com.br/h0/i_audiob.gif
</textarea></form>

function startSlide(){ 
loadImages();
if(!paused) timeoutId=setTimeout('changeImg(1)',6000);
} function initialize(){
timeoutId=0;
textareaContent=d.form_cr.select_cr.value.split(/[\r\n]/i);
Item = new Array();
for(x=0,y=0;x<textareaContent.length;x++){ 
	if(textareaContent[x].length>30) Item[y++]=textareaContent[x].split('|');
	}
for(i=Item.length-1;i>=0;i--){
	Item[i][0]=Item[i][0].replace(/([ \n\t\r])+/, " ");
	Item[i][4]=(Item[i][4].length<3) ? '' : '<img src="'+Item[i][4]+'" border="0" style="margin-left:4px;" />';
	if(Item[i][1].length<3||Item[i][3].length<3||Item[i][2].length<3||Item[i][0].length<2) delItem(Item,i);
	}
if(Item.length==1) d.write('<style>#anterior,#proximo,#pause{visibility:hidden;}</style>');
atual = Math.random().toString().substring(2,6) % Item.length;
} function startPanel(){
usaCredito = '';
initialize();
if(arguments.length>0){
	if(!isNaN(arguments[0])) atual = arguments[0];
	}
if(paused) {imgpause='on'; altpause='alt="Ligar" title="Ligar"';}
else {imgpause='off'; altpause='alt="Parar" title="Parar"';}
d.write('<div id="to-blend">'+usaCredito+'<a href="java script:goURL()"><img src="'+Item[atual][1]+'" id="imgslide" name="img1" border="0" title="'+Item[atual][0]+'" alt="'+Item[atual][0]+'"></a>');
d.write('<h2><a href="java script:goURL()" id="p-link"><span id="txt1">'+Item[atual][2]+'</span><span id="icon-area">'+Item[atual][4]+'</span></a></h2></div>');
d.write('<div id="prox-ant"><a href="java script:void(0)" id="anterior" onclick="if(okToGo)changeImg(-1)"><img src="http:\/\/home.img.uol.com.br/h2/botao-anterior.gif" border="0" /></a><img src="http:\/\/home.img.uol.com.br/h2/botao-pause1-'+imgpause+'.gif" onclick="pauseSlide()" id="pause" '+altpause+' />');
d.write('<a href="java script:void(0)" id="proximo" onclick="if(okToGo)changeImg(1)"><img src="http:\/\/home.img.uol.com.br/h2/botao-proxima.gif" border="0" /></a></div>');
} function pauseSlide(){
if(paused){
	$('pause').src='http:\/\/home.img.uol.com.br/h2/botao-pause1-off.gif';
	$('pause').title='Parar'; $('pause').alt = 'Parar';
	d.cookie="homeUOLpause=0;domain=.uol.com.br;expires=Thu, 2 Aug 1970 20:47:11 UTC;"; 		
	paused=false;
	startSlide();
}else{
	clearTimeout(timeoutId);
	d.cookie="homeUOLpause=1;domain=.uol.com.br;expires=Thu, 2 Aug 2222 20:47:11 UTC;"; 	
	$('pause').src='http:\/\/home.img.uol.com.br/h2/botao-pause1-on.gif';
	$('pause').title='Ligar'; $('pause').alt = 'Ligar';
	paused = true;
} }

var okToGo=false;
var paused=(d.cookie.indexOf('homeUOLpause=1')!=-1) ? true : false;
onload=startSlide;

Monta ae e testa, se não funcionar vai na página deles e procura pela função acima dessa que eu coloquei, não vi se faz referência. E quando você quiser uma função que já existe em um site é mais fácil abrir o código fonte e procurar, a menos que você postou esperando que alguém fosse fazer uma pra você. :P
WebFórum - Equipe de Desenvolvimento - Monitor
Posted Image
Yeah I do have some stories, and it's true I want all the glory ...

#3 zóio

zóio

    Turista

  • Usuários
  • 44 posts
  • Sexo:Não informado

Posted 21/09/2006, 11:30

valew pelo código e pela dica, o que eu queria saber era se era javascript com xml e tal, mas já respondeu, valew!




1 user(s) are reading this topic

0 membro(s), 1 visitante(s) e 0 membros anônimo(s)

IPB Skin By Virteq