Jump to content


Photo

Não Sei Por Onde Começar


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

#1 Webeverton

Webeverton

    Turista

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

Posted 05/10/2006, 14:23

Olá.

Eu tô pensando em fazer um sistema que funcione semelhante ao do uol, por exemplo, onde as manchetes vão se alternando durante a passagem do tempo, ou controladas pelos botões.

Eu penso que deve ser feito algo assim.

São 3 ou 4 ou 5 tabelas (dependendo da quantidade de matérias que desejo passar), e com um contador de tempo que mude a tabela visivel de acordo com o timer.
<script>
function mostra()
		{	 
		 if (document.getElementById("mudasenha").checked)
			 document.getElementById("tabelinha").style.display = "block";
			else
			 document.getElementById("tabelinha").style.display = "none";
		}
</script>

Eu queria saber como fazer um timer, pra utilizar em cima deste código aí....

Valeu!!!!
:D (y)

#2 bimonti

bimonti

    Super Veterano

  • Usuários
  • 2654 posts
  • Sexo:Masculino

Posted 05/10/2006, 14:32

Ebaaaa, eu tenho, eu tenho ... mas não vou te dar !!! :P

É isso aqui que você quer ?? exemplo!

Eu to mexendo nesse site esses dias e fiz um esquema assim mas ainda não sei se vou usar, é só um projeto de reestruturação por enquanto, idéias tem algumas, quais serão aceitas só os cara lá que sabe.

Se for pode pegar o código fonte, é JavaScript (JSON) com uma pitada de CSS, ou se quiser dá um toque que eu vejo se separo e anexo aqui. Mais pra frente vou implementar um relógio pro usuário controlar o tempo de rotação das imagens (tá feito, mas tá na minha casa) ... e qdo sobrar uma graninha eu pago meu domínio de novo e coloco lá gratuitamente de grátis pra desenvolvedores... :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 Webeverton

Webeverton

    Turista

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

Posted 05/10/2006, 14:45

êba!!!

Vou testar!

:D

Então... fiz assim:

<script>
//SlideShow-->
slide = {
	_imagens : [
			<?
			$manchetes = mysql_query("select * from bandas order by rand()",$tcconn);
				while($mnct = mysql_fetch_row($manchetes)){
	
			?>
			["/imagens/manchetes/<? print $mnct[4]; ?>","<? print str_replace("\"","",$mnct[1]); ?>","<? print str_replace("\"","",$mnct[2]); ?>","<? print $mnct[3]; ?>"],
			<?
			$total = $total + 1;
			}
			?>
		],
	
	_count : 0,
	
	_length : <? print $total; ?>,
	
	_timeOutID : null,
	
	pause : false,
	
	_start : function(){
		this._preLoader();
		this._work();
	},
	
	_preLoader : function(){
		for(x in this._imagens){
			var image = new Image();
			image.src = this._imagens[x][0];
		}
	},
	
	_work : function(){
		(this._count == this._length) ? this._count = 0 : (this._count < 0) ? this._count = this._length-1 : void(0);
		var current = this._imagens[this._count];
		this._exchange(current);
		if(!this.pause){
			(typeof(this._timeOutID) == "number") ? clearTimeout(this._timeOutID) : void(0);
			this._timeOutID = setTimeout(function(){ slide._next(); }, 4000);
		}
	},
	
	_exchange : function(img){
		document.getElementById("slideImg").src = img[0];
		document.getElementById("titleSlide").innerHTML = img[1]
		document.getElementById("textSlide").innerHTML = img[2]
		document.getElementById("dataSlide").innerHTML = img[3];
	},
	
	_next : function(){
		this._count++;
		this._work();
	},
	
	_previous : function(){
		this._count--;
		this._work();
	},
	
	_pause : function(){
		var img = document.getElementById("play|pause");
		if(this.pause){
			this.pause = false;
			img.src = 'imagens/pause.gif';
			img.title = 'Parar';
		}
		else{
			this.pause = true;
			img.src = 'imagens/play.gif';
			img.title = 'Continuar';		
		}
		(typeof(this._timeOutID) == "number") ? clearTimeout(this._timeOutID) : void(0);
		this._work();
	}
}
//SlideShow-->
</script>

Porque eu preciso que seja misturado com os lances do PHP, e tals, e coloquei mais um campo, que seria a data...

Mas dá erro, dizendo:

O objeto não dá suporte ....

Enfim...

Não me endenti mais...

Sem o PHP, eu fiz funcionar legal...

Alguma dica?

:D

#4 bimonti

bimonti

    Super Veterano

  • Usuários
  • 2654 posts
  • Sexo:Masculino

Posted 05/10/2006, 17:56

Esse elemento existe ná página ?

document.getElementById("dataSlide").innerHTML = img[3];

E o slide tem que ser chamado (slide._start()) após o elemento ser declarado, eu costuma colocar a chamada pro slide no fim da página pra evitar algum erro.

Edit -->
Se por acaso não for isso, dá um print na matriz que voce gerou com o php pra ver se ela está ok ...

Edição feita por: bimonti, 05/10/2006, 17:58.

WebFórum - Equipe de Desenvolvimento - Monitor
Posted Image
Yeah I do have some stories, and it's true I want all the glory ...

#5 Webeverton

Webeverton

    Turista

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

Posted 05/10/2006, 18:01

Yeah!

Eu coloquei ele pra mostrar a data...

fiz certo?

#6 bimonti

bimonti

    Super Veterano

  • Usuários
  • 2654 posts
  • Sexo:Masculino

Posted 05/10/2006, 18:47

Então, mas ainda não funcionou ??

Sem usar o php, mas aumentando a array com a data você conseguiu fazer funcionar ?? Pega esse código php que voce implementou e roda ele sozinho em uma outra página e posta o que ele imprimiu para eu ver.

Edit -->

Aliás, tenta também trocar o valor do primeiro elemento da matriz, tira a primeira barra (imagens/manchetes/), se mesmo assim não funcionar posta também qual linha deu erro.

Edição feita por: bimonti, 05/10/2006, 18:49.

WebFórum - Equipe de Desenvolvimento - Monitor
Posted Image
Yeah I do have some stories, and it's true I want all the glory ...

#7 Webeverton

Webeverton

    Turista

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

Posted 06/10/2006, 01:34

O problema dá quando eu tento adicionar novos campos ao sistema... Por exemplo, ele até atualiza aquele lance que eu coloquei, novo, só que dá erro na página...

Alguma dica?

#8 bimonti

bimonti

    Super Veterano

  • Usuários
  • 2654 posts
  • Sexo:Masculino

Posted 06/10/2006, 08:19

Dica não, mas seria bom você postar o erro e a linha que ele acontece pra eu saber como ajudar. Se você tiver o Firefox instalado vai em Ferramentas > Console do JavaScript e posta certinho o erro, ele costuma reportar melhor, além de você poder ver qual o lugar do script que o erro acontece.
WebFórum - Equipe de Desenvolvimento - Monitor
Posted Image
Yeah I do have some stories, and it's true I want all the glory ...

#9 Webeverton

Webeverton

    Turista

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

Posted 06/10/2006, 09:27

Olá...

Deu erro na seguinte linha:

//SlideShow-->
slide = {
	_imagens : [
						["/imagens/manchetes/manchete8.jpg","MultiLOG","Que tal ter seu espaço na internet? Então entre agora no MultiLOG TuaCara.com.br. Fotos, vídeos, músicas e muito mais... Acesse e cadastre-se. É grátis!","05/10/06"],
						["/imagens/manchetes/manchete10.jpg","Shopping","Agora, você pode fazer suas compras no TuaCara.com.br<BR><BR>Clique e confira. Você vai se surpreender.","06/10/06"],
					],
	
	_count : 0,
	
	_length : 2,
	
	_timeOutID : null,
	
	pause : false,
	
	_start : function(){
		this._preLoader();
		this._work();
	},
	
	_preLoader : function(){
	for(x in this._imagens){
			var image = new Image();
			image.src = this._imagens[x][0];
		}
	},
	
	_work : function(){
		(this._count == this._length) ? this._count = 0 : (this._count < 0) ? this._count = this._length-1 : void(0);
		var current = this._imagens[this._count];
		this._exchange(current);
		if(!this.pause){
			(typeof(this._timeOutID) == "number") ? clearTimeout(this._timeOutID) : void(0);
			this._timeOutID = setTimeout(function(){ slide._next(); }, 4000);
		}
	},
	
	_exchange : function(img){
		document.getElementById("slideImg").src = img[0];
		document.getElementById("titleSlide").innerHTML = img[1]
		document.getElementById("textSlide").innerHTML = img[2];
	},
	
	_next : function(){
		this._count++;
		this._work();
	},
	
	_previous : function(){
		this._count--;
		this._work();
	},
	
	_pause : function(){
		var img = document.getElementById("play|pause");
		if(this.pause){
			this.pause = false;
			img.src = 'imagens/pause.jpg';
			img.title = 'Parar';
		}
		else{
			this.pause = true;
			img.src = 'imagens/play.jpg';
			img.title = 'Continuar';		
		}
		(typeof(this._timeOutID) == "number") ? clearTimeout(this._timeOutID) : void(0);
		this._work();
	}
}
//SlideShow-->


for(x in this._imagens)

Tá dificil de fazer funcionar. Na página onde é pra ficar, nem roda o código. Ao menos nas outras, funcionava legal.

Opa...

Funcionou o trem aqui...

Só que eu tive que tirar o lance da data.

Se eu quiser colocar mais informações para mostrar, é só adicionar no "_imagens" e criar um uma div com o ID referente (referenciando-a na parte _exchange?)?

Valeu!

Edição feita por: Webeverton, 06/10/2006, 09:28.


#10 bimonti

bimonti

    Super Veterano

  • Usuários
  • 2654 posts
  • Sexo:Masculino

Posted 06/10/2006, 11:16

Em teoria é isso mesmo, é só adicionar o elemento na matriz e depois indicar em qual div vai aparecer.

Faz o seguinte teste, muda o loop do preloader pra isso:

for(x in this._imagens){
			var image = new Image();
			alert(this._imagens[x][0];
			image.src = this._imagens[x][0];
		}

Verifique se no alerta vai aparecer algum undefined.
WebFórum - Equipe de Desenvolvimento - Monitor
Posted Image
Yeah I do have some stories, and it's true I want all the glory ...

#11 Webeverton

Webeverton

    Turista

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

Posted 06/10/2006, 11:30

Beleza... funcionou...

Só uma última dúvida.

Eu quero fazer um link também, que mude de acordo com a mudança do esquema, só que não dá pra ser numa DIV, porque senão ele mostra o texto do link, e não o a href...

Como fazer?

mais uma vez valeu, e desculpa a chateação

:D (y)

#12 bimonti

bimonti

    Super Veterano

  • Usuários
  • 2654 posts
  • Sexo:Masculino

Posted 06/10/2006, 12:32

não entendi, vc quer q cada slide link para um lugar? adiciona mais um valor na matriz e usa o inner html tbm ...
WebFórum - Equipe de Desenvolvimento - Monitor
Posted Image
Yeah I do have some stories, and it's true I want all the glory ...

#13 Webeverton

Webeverton

    Turista

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

Posted 06/10/2006, 12:37

mas é que não dá pra usar o innerHTML em uma div, porque daí ele mostra o valor. só se eu usar a DIV dentro do <a href=<div>...

isso rola?

vou testar...

qualquer coisa, depois eu volto!


valeu!

:lol:

#14 bimonti

bimonti

    Super Veterano

  • Usuários
  • 2654 posts
  • Sexo:Masculino

Posted 06/10/2006, 13:48

Então, o que você que não é isso:

<div>
<a href="">
<img />
<div>Titulo Noticia</div>
</a>
</div>

???

É só montar todo o conteúdo com JavaScript e dar um innerHTML em uma div só....
WebFórum - Equipe de Desenvolvimento - Monitor
Posted Image
Yeah I do have some stories, and it's true I want all the glory ...

#15 Webeverton

Webeverton

    Turista

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

Posted 09/10/2006, 11:30

Opa... e aí... cara

tentei de tudo que foi jeito. Do que tu colocou ali em cima, mas daí aparece o escrito, e não fica o link.
tentei colocar a div dentro do <a href='<div....' mas também não deu.

tentei colocar o <a href='' id='linkdoslide'... mas também não deu. não tem como alterar a opção href da tag do link?

como se pega ela através de javascript, para fazer a modificação?

Valeu...

E desculpa outra vez a chateação!

:D (y)




1 user(s) are reading this topic

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

IPB Skin By Virteq