Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Paulo Afonso Cordeiro

Mudar posição de um DIV com JS e CSS

Recommended Posts

Pessoal to com uma dúvida meio intrigante.

 

Tenho um DIV em minha página e quero que num determinado intervalo de tempo a propriedade LEFT do STYLE do mesmo seja acrescido de mais 1px. Tentei de várias formas e não consegui. Criei uma funçao JS e chamo-a no evento onload do BODY. Alguns trechos comentados são as tentativas.

 

função JS

function efeito () {	  var obj = document.getElementById('efeito')	  v = obj.style.left;	  obj.style.left = v + "1px"		  setInterval("obj.style.left px", 8000);   //	  obj.style.left = obj.style.left + 1 + 'px'//	  obj.style.left += obj.style.left + 1 + 'px'}

 

Vlws

Compartilhar este post


Link para o post
Compartilhar em outros sites

tenta assim:<script language="JavaScript" type="text/javascript">var t;var cont = 0;function efeito() { cont += 1; valor = cont*1; alert(valor); document.getElementById('efeito').style.left = valor + 'px'; t=setTimeout("efeito()",8000) }</script>

Compartilhar este post


Link para o post
Compartilhar em outros sites

tenta assim:<script language="JavaScript" type="text/javascript">var t;var cont = 0;function efeito() { cont += 1; valor = cont*1; alert(valor); document.getElementById('efeito').style.left = valor + 'px'; t=setTimeout("efeito()",8000) }</script>

Eu tentei fazer isso e deu erro na linha:
<body onload="efeito();">
Tanto faz colocar ";" no final né?
Erro: O Objeto não dá suporte para a propriedade ou método.
Fiz uma página simples somente com o DIV para alterar o Left e também não deu.Abs

Compartilhar este post


Link para o post
Compartilhar em outros sites

tenta assim:<script language="JavaScript" type="text/javascript">var t;var cont = 0;function efeito() { cont += 1; valor = cont*1; alert(valor); document.getElementById('efeito').style.left = valor + 'px'; t=setTimeout("efeito()",8000) }</script>

Eu tentei fazer isso e deu erro na linha:
<body onload="efeito();">
Tanto faz colocar ";" no final né?
Erro: O Objeto não dá suporte para a propriedade ou método.
Fiz uma página simples somente com o DIV para alterar o Left e também não deu.Abs
Testa aí<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><title>Untitled Document</title><script language="JavaScript" type="text/javascript">var t;var cont = 0;function vai(){cont += 10;valor = cont*1;alert(valor);document.getElementById('efeito').style.left = valor + 'px';t=setTimeout("vai()",8000)}</script><style type="text/css"><!--*{margin:0; padding:0}#efeito { background-color: #FF0000; position: absolute;}--></style></head><body onload="vai()"><div id="efeito">Content for id "efeito" Goes Here</div></body></html>

Compartilhar este post


Link para o post
Compartilhar em outros sites

E Ae to eu aqui denovo!!!

 

Valeu pelo HELP.

 

É o seguinte: O código acima funcionou beleza.. ai fui adaptando ao meu.

 

descobri o erro no meu código, mas não consegui resolver.

ele funciona quando coloco

 

<script language="JavaScript" type="text/javascript">

 

Mas quando adiciono o arquivo

 

<script language="JavaScript" src="script.js" type="text/javascript">
ele dá o erro ora citado.

 

como resolver isso???

Compartilhar este post


Link para o post
Compartilhar em outros sites

E Ae to eu aqui denovo!!!Valeu pelo HELP.É o seguinte: O código acima funcionou beleza.. ai fui adaptando ao meu.descobri o erro no meu código, mas não consegui resolver.ele funciona quando coloco

<script language="JavaScript" type="text/javascript">
Mas quando adiciono o arquivo
<script language="JavaScript" src="script.js" type="text/javascript">
ele dá o erro ora citado.como resolver isso???
Aqui deu certo mesmo separando o css:teste.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><title>Untitled Document</title><link href="teste.css" rel="stylesheet" type="text/css"/><script language="JavaScript" type="text/javascript" src="teste.js"></script></head><body onload="vai()"><div id="efeito">Content for id "efeito" Goes Here</div></body></html>

teste.js

var t;var cont = 0;function vai(){cont += 10;valor = cont*1;alert('deu');document.getElementById('efeito').style.left = valor + 'px';t=setTimeout("vai()",8000)}

teste.css

*{margin:0; padding:0}#efeito {background-color: #FF0000;position: absolute;}

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.