countdown

rafvenditti · Abril 7, 2014

estou tentando fazer um contado regressivo de dias, se alguem puder me ajuda

o codigo que consegui eh este

<script type="text/javascript">
var before="Evento";
var current="Hoje";
var montharray=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec");
function countdown(yr,m,d){
var today=new Date();
var todayy=today.getYear();
if (todayy < 1000);
todayy+=1900;
var todaym=today.getMonth();
var todayd=today.getDate();
var todaystring=montharray[todaym]+" "+todayd+", "+todayy;
var futurestring=montharray[m-1]+" "+d+", "+yr;
var difference=(Math.round((Date.parse(futurestring)-Date.parse(todaystring))/(24*60*60*1000))*1);
if (difference==0)
document.write(current);
else if (difference>0)
document.write("Only "+difference+" days until "+before);
}
countdown(2014,5,18)
</script>

so que eu fiz uma div, e nao estou conseguindo mudar para aparecer nessa div, sei q tenho q mudar de

document.write

para

document.getElementById

e nao estou consguindo isso, alguem poderia me ajudar? o id da div eh contador

desde ja agradeco

reebr · Abril 8, 2014

var el = document.getElementById('contador');

if (!difference)

el.innerHTML = current;

else el.innerHTML = 'Only ' + difference + ' days until ' + before;

rafvenditti · Abril 8, 2014

So que inserindo esse codigo, bugou em 2 linhas

pra mim linha 28 no codigo

else el.innerHTML = 'Only ' + difference + ' days until ' + before;

e no countdown com a data tbm. no codigo

countdown(2014,5,18)

para entenderem melhor ficou assim a pagina inteira

<!doctype HTML>
<html lang="pt-br">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1">
<title>Anixter ETF 2014</title>
    <link rel="stylesheet" href="css/estilos.css">
    <script type="text/javascript">
var before="Evento";
var current="Hoje";
var montharray=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec");
function countdown(yr,m,d){
var today=new Date();
var todayy=today.getYear();
if (todayy < 1000);
todayy+=1900;
var todaym=today.getMonth();
var todayd=today.getDate();
var todaystring=montharray[todaym]+" "+todayd+", "+todayy;
var futurestring=montharray[m-1]+" "+d+", "+yr;
var difference=(Math.round((Date.parse(futurestring)-Date.parse(todaystring))/(24*60*60*1000))*1);
if (difference==0)
document.write(current);
else if (difference>0)
var el = document.getElementById('contador');
if (!difference)
    el.innerHTML = current;
else el.innerHTML = 'Only ' + difference + ' days until ' + before;
}
countdown(2014,5,18)
</script>       
</head>
<body>
<div id="envelope" style="">
        <nav id="menu" align="center"> 
            <ul>               
                <li><a href="#">HOME</a></li>
                <li><a href="#">|</a></li>
                <li><a href="#">AGENDA</a></li>
<li><a href="#">|</a></li>
                <li><a href="#">INSCRIÇÕES</a></li>
<li><a href="#">|</a></li>
                <li><a href="#">INFORMAÇÕES</a></li>
<li><a href="#">|</a></li>
                <li><a href="#">LOCAL</a></li>
<li><a href="#">|</a></li> 
                <li><a href="#">PATROCINADORES</a></li>
</ul> 
        </nav>
        <section id="imagem">
         <img src="images/banner.jpg"></img>            
      </section>
      <div id="inscrevase">
        <table width="100%" height="100%" border="0" cellspacing="0" cellpadding="0">
          <tr>
            <td align="center" style="color: #FFF;"><a href="#">INSCREVA-SE</a></td>
          </tr>
        </table>
      </div>     
      <div id="texto">
      <p><em>ENVISIONING THE FUTURE</em> é uma iniciativa da Anixter junto aos seus principais parceiros <br/> com o objetivo de compartilhar visões tecnológicas, de negócios e estratégias.</p>
<p>Para a Anixter, <em>“Visão de Futuro”</em> é proporcionar o contato de nossos clientes especiais <br/> às tendências de mercado e ferramentas que possam ajudar na estratégia do seu <br/> negócio. <a href="#" style="color: #EB9242; text-decoration: underline;">Participe inscrevendo-se aqui.</a></p>
      </div>
      <div id="palestrantes">
      <table width="85%" height="130px" border="0" cellspacing="6" cellpadding="0">
      <tr>
      <td width="10%"><p><img src="images/palestrante1.jpg"></p>
        <p> </p></td>
      <td width="25%"><p><em>MAILSON DA NÓBREGA</em></p>
        <p> </p>
        <p style="font-size:8pt;">Dr. Mailson elabora suas apresentações levando em consideração seu vasto conhecimento econômico e<br> as noticias atuais sobre os diferentes setores do comércio, indústria do Brasil e exterior, analisando os diferentes setores comenta a atual conjuntura econômica e tendências nacionais e
internacionais.</p>
        <p style="font-size:8pt;"> </p>
        <p style="font-size:8pt;"> </p>
        <p style="font-size:8pt;"> </p></td>
      <td width="10%"><p><img src="images/palestrante2.jpg"></p>
        <p> </p></td>
      <td width="25%"><p><em>AMYR KLINK</em></p>
        <p> </p>
        <p style="font-size:8pt;text-align: justify;">Em suas palestras, baseadas em suas <br>experiências ao longo de mais de<br> 25 anos
como navegador e empreendedor,<br> Amyr Klink aborda temas como:<br> Planejamento,
Desafios, Superação de limites,<br> Lidando com imprevistos e Liderança, <br>entre
outros.</p>
        <p style="font-size:8pt;text-align: justify;"> </p>
        <p style="font-size:8pt;text-align: justify;"><br> 
      </p></td>
      </tr>
      </table>
</div>
<div id="contador"></div>
      <div id="barracinza"></div> 
  <div id="logoevento"><img src="images/logo_etf.png"></div>       
      <div id="logosmaster"><img src="images/patrocinadores.png"></div>
</div>
<footer>
<p></p>
</footer>
</body>
</html>

nao mencionei, esta dando bug no innerHTML

reebr · Abril 8, 2014

Certo, qual "bug" está dando?

Você está pegando o elemento dentro do "if (difference > 0)".


//if (difference==0)  //isso é o mesmo que if (!difference) 
//document.write(current); 
//else if (difference>0)
var el = document.getElementById('contador');
if (!difference)
    el.innerHTML = current;
else el.innerHTML = 'Only ' + difference + ' days until ' + before;
//}

Substitui TUDO ISSO AÍ por isto:

var el = document.getElementById('contador');
if (!difference)
   el.innerHTML = current;
else el.innerHTML = 'Only ' + difference + ' days until ' + before;

Se der "bug", especifique qual foi o problema: CTRL + SHIFT + J

rafvenditti · Abril 8, 2014

Continua com bug, alterei isso esta dizendo "Uncaught TypeError: Cannot set property 'innerHTML' of null " na linha 25

else el.innerHTML = 'Only ' + difference + ' days until ' + before;

countdown na linha 25 e (anonymous function) na linha 27 que esta utilizando este codigo

countdown(2014,5,18)

reebr · Abril 8, 2014

Você está colocando o script antes da div 'conteudo'. Como ele vai pegar algo que ainda "não existe"?

Ou você coloca o script depois da div (antes de fechar a tag <body>), ou, chama a sua função desta forma:

window.onload = function(){
    //sua função
};

rafvenditti · Abril 9, 2014

Deu certo, brigado agora so tentar alinhar no box.

Entrar

Arquivado

countdown

Recommended Posts

rafvenditti 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

reebr 94

Compartilhar este post

Link para o post

Compartilhar em outros sites

rafvenditti 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

reebr 94

Compartilhar este post

Link para o post

Compartilhar em outros sites

rafvenditti 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

reebr 94

Compartilhar este post

Link para o post

Compartilhar em outros sites

rafvenditti 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

JAVA - Ajuda em Paginação

JAVA - Orientação para Invalidar Sessão

printf iniciante básico

Este projeto é apoiado pelas empresas

Fóruns

Tempo Real

Informação importante